占位符选择器 %

2021/4/23 18:57:10

本文主要是介绍占位符选择器 %,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

占位符选择器 %

占位符选择器的作用,个人看来是将一类属性分组,但是改组不需要转化css,而是在之后的编辑中可能用到,为了避免重复工作,使用占位符选择器预先定义好,使用的时候使用继承直接拉到需要的选择器中,可以重复使用

%aBtn{  
font-size: 20px; 
  text-align: center; 
    color: #fff; 
      border-radius: 5px;  
       box-shadow: 3px 3px 5px 0 #666;
        }
         .btn {
          width: 200px;
             height: 50px; 
               background-color: red;
                  @extend %aBtn; } 

结果是

.btn {
  font-size: 20px;
  text-align: center;
  color: #fff;
  border-radius: 5px;
  box-shadow: 3px 3px 5px 0 #666;
}

.btn {
  width: 200px;
  height: 50px;
  background-color: red;
}

/*# sourceMappingURL=b.css.map */

缺点是,没有综合起来而是将其分作两次生成了同一个选择器的两次编辑,使用css的层叠性来使用



这篇关于占位符选择器 %的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!


扫一扫关注最新编程教程