时间戳

首页 > 解决方案 > 为什么它不是以 div 为中心的？我无法理解

html - 为什么它不是以 div 为中心的？我无法理解

问题描述

<div style="border-radius:50px 10px;width:60%;border: 1px solid #123467;background:linear-gradient(to top, #88D3CE 0%, #6E45e2 100%);display:inline-block;float:right">
  <div style="align:center;border-radius:10px 50px;margin-top:5%;text-align:center;width:60%;border: 1px solid #ffffff;background:linear-gradient(-225deg,#A445B2 0%, #D41872 52%, #FF0066 100%)">
    <br/>
		<h3 style="color:black">Running from</h3>
	</div>
	<br/>
</div>

尽管我也在样式（CSS）中插入了对齐标签，但蓝色、粉色、紫色的 div 不是中心。为什么？

谢谢安德里亚

标签： htmlcssalignment

解决方案

您可以添加margin: 5% auto;到您的内部 DIV：

<style>
    #firstDiv
    {
        border-radius:50px 10px;
        width:60%;
        border: 1px solid #123467;
        background:linear-gradient(to top, #88D3CE 0%, #6E45e2 100%);
        display:inline-block;
        float:right;
    }

    #secondDiv {
        border-radius:10px 50px;
        margin: 5% auto;
        width:60%;
        border: 1px solid #ffffff;
        background:linear-gradient(-225deg,#A445B2 0%, #D41872 52%, #FF0066 100%);
        text-align: center;
    }

    #secondDiv h3 {
        color: black;
    }
</style>

<div id="firstDiv" style="">
    <div id="secondDiv" style="">
        <h3>Running from</h3>
    </div>
</div>

但是我建议将样式和 html 分开。

推荐阅读