水平线和正确的方式编码它在 html，css

小开

我会选择语义标记，使用 <hr/>。

除非它只是一个你想要的边框，那么你可以使用填充，边框和边距的组合，以获得所需的边界。

小开

在 HTML5中，<hr>标记定义了一个主题中断 <hr>标记表示水平规则。

所以在定义之后，我更喜欢 <hr>

小开

最佳答案

hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #ccc;
margin: 1em 0;
padding: 0;
}

<div>Hello</div>
<hr/>
<div>World</div>

hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #ccc;
margin: 1em 0;
padding: 0;
}

小开

如果你真的想要一个 主题广播，一定要使用 <hr>标签。

如果你只是想要一个设计线，你可以使用类似 css 类

.hline-bottom {
padding-bottom: 10px;
border-bottom: 2px solid #000; /* whichever color you prefer */
}

然后把它当成

<div class="block_1 hline-bottom">Cheese</div>

小开

我的简单解决方案是使用 css 设计 hr，使其上下边距为零，边框为零，高度为1像素，背景颜色对比鲜明。这可以通过直接设置样式或定义类来实现，例如:

.thin_hr {
margin-top:0;
margin-bottom:0;
border:0;
height:1px;
background-color:black;
}

小开

这取决于需求，但许多开发人员建议将代码作为 越简单越好。所以，用简单的“ hr”标签和 CSS 代码。

小开

hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #ccc;
margin: 1em 0;
padding: 0;
}

<div>Hello</div>
<hr/>
<div>World</div>

强调的文字

小开

我想要一条长长的破折号线，所以我用了这个。

.dash{
border: 1px solid red;
width: 120px;
height: 0px;


}

<div class="dash"></div>

小开

.line {
width: 53px;
height: 0;
border: 1px solid #C4C4C4;
margin: 3px;
display:inline-block;
}

<html>
<body>
<div class="line"></div>
<div style="display:inline-block;">OR</div>
<div class="line"></div>
</body>
</html>

小开

这是一个相对简单的例子，对我很有用。

hr {
width: 70%;
margin-left: auto;
margin-right: auto;
}