如何正确加入一些媒体查询

时间:2015-06-12 07:51:51

标签: css media-queries

我有一个情况,我决定使用media querieshtml代码:

...
   <span class="logotext-n">n</span>

    .
    .

   <span class="logotext-u">u</span>
...

Css实施:

...
@media screen and (-webkit-min-device-pixel-ratio:0) { 
        .logotext-n {
          color: #f1ecd6;    
          font-family: "arial black", sans-serif;
          font-weight: 900;
          font-size: 210px;
          text-transform: lowercase;
          letter-spacing: -18px;
              }
}

        .
        .

@media screen and (-webkit-min-device-pixel-ratio:0) { 
        .logotext-u {
          color: #f1ecd6;    
          font-family: "arial black", sans-serif;
          font-weight: 900;
          font-size: 210px;
          text-transform: lowercase;
          letter-spacing: 0;
              }
}
... 

此时我想知道,是否有可能使用单个css加入这些@media screen属性?感谢

1 个答案:

答案 0 :(得分:1)

是的,只是把它放在一起

@media screen and (-webkit-min-device-pixel-ratio:0) { 
      .logotext-n {
          color: #f1ecd6;    
          font-family: "arial black", sans-serif;
          font-weight: 900;
          font-size: 210px;
          text-transform: lowercase;
          letter-spacing: -18px;
       }

      .logotext-u {
          color: #f1ecd6;    
          font-family: "arial black", sans-serif;
          font-weight: 900;
          font-size: 210px;
          text-transform: lowercase;
          letter-spacing: 0;
      }
}

        .
        .