嵌套-选择器嵌套
所谓选择器嵌套指的是在一个选择器中嵌套另一个选择器来实现继承,从而增强了sass文件的结构性和可读性。
在选择器嵌套中,可以使用&表示父元素选择器
Sass style
#top_nav{
line-height: 40px;
li{
float:left;
}
a{
padding: 0 10px;
color: #fff;
&:hover{
color:#ddd;
}
}
}
CSS style
#top_nav{
line-height: 40px;
}
#top_nav li{
float:left;
}
#top_nav a{
padding: 0 10px;
color: #fff;
}
#top_nav a:hover{
color:#ddd;
}
请最终编译CSS是这样的
#top_nav a{
padding: 0 10px;
color: #fff;
}
#top_nav a:hover{
color:#ddd;
},用sass语法练习下。