Fyg*_*ygo 0 html css css-selectors
我有一个div,里面有2个浮动的div.在他们上面有一个HR标签.我试图使用第一个孩子,因为div之间应该有一个间距.但是,这不起作用.规则永远不会被应用.好像hr标签打破了它; 如果我删除小时它工作正常.另外:最后一个孩子工作正常,有或没有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;
}