较少嵌套的媒体查询

时间:2015-05-17 11:28:40

标签: css less

我有以下代码..

.tbl-title{
padding-left:20px;
position:static;
@media(min-width:768px){
    width:300px;
}

但我有多个名为tbl- [something]的类 所以我把它们转换成以下格式

.tbl{
    &-id{
        ....
    }
    &-title{
        padding-left:20px;
        width:100%;
        position:static;
        @media(min-width: 768){
           width: 300px;
        }
    }
    &-user{
    }
   ....

现在它已经不再适用了。

这是否意味着我无法将媒体查询嵌入&选择器?

这里是我的两个代码的编译版本

.tbl-title {
  padding-left: 20px;
  position: static;
}
@media (min-width: 768px) {
  .tbl-title {
    width: 300px;
  }
}

.tbl-title{
  padding-left:20px;
  position:static
}
@media (min-width:768){
  .tbl-title{
    width:300px
  }
}

你可以看到它们完全相同,除了最后的分号,这不应该是问题。

0 个答案:

没有答案