本节我们学习 Sass 中的 @media
指令,@media
指令用于设置样式规则到不同的媒体类型,这和 CSS 的使用规则差不多,但是它还有一点不同,就是 @media
指令可以嵌套在 Sass 选择器中。有点类似于 JS 冒泡功能,它会冒泡到样式表的顶层。
@media指令的使用
示例:
.xkd{
width: 300px;
height: 100px;
@media screen and (orientation: portrait) {
width: 500px;
}
}
编译成 CSS 代码:
.xkd {
width: 300px;
height: 100px;
}
@m