猫头鹰选择器
猫头鹰选择器
It may have a strange name but using the universal selector (*) with the adjacent sibling selector (+) can provide a powerful CSS capability;
它的名称可能很奇怪，但是将通用选择器（ * ）与相邻的兄弟选择器（ + ）结合使用可以提供强大的CSS功能；
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.main{
width: 500px;
height: 500px;
border: 1px solid #cccccc;
}
.main div{
border: 1px solid #000000;
height: 80px;
}
.main div + div{
margin-top: 10px;
}
</style>
</head>
<body>
<div class="main">
<div class="div1">div1</div>
<div class="div2">div2</div>
<div class="div3">div3</div>
<div class="div4">div4</div>
</div>
</body>
</html> 添加猫头鹰选择器前 .main div + div{ margin-top: 10px; } 样式前
功能：除了第一个元素，其他兄弟元素都要设置该样式。
添加后,除了第一个元素外，其他的兄弟元素的上部边距都设置为 10px;
投递科大讯飞等公司10个岗位 >