我有一个 div，里面有 2 个 float 的 div。在它们上方有一个 HR 标签。我正在尝试使用第一个 child ，因为 div 之间应该有一个间距。但是，这不起作用。该规则永远不会被应用。好像 hr 标签打破了它；如果我删除 hr 它工作正常。另外 :last-child 工作正常，有或没有 hr。有人对此有一些合乎逻辑的解释吗？
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
#outer {
width: 600px;
}
#outer > div {
float: left;
width: 290px;
background-color: #1982c8;
}
#outer > div:first-child {
margin-right: 20px;
}
</style>
</head>
<body>
<div id="outer">
<hr>
<div>
First inner.
</div>
<div>
Second inner.
</div>
</div>
</body>
</html>
最佳答案
<hr>元素确实是其父元素的第一个子元素，而不是 <div> .因此，:first-child在这里不合适。
如果您的目标浏览器支持 CSS3，您可以使用 :first-of-type相反:
#outer > div:first-of-type {
margin-right: 20px;
}
关于css - HTML 中的 hr 中断 div :first-child?，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21193125/