1. ·您当前的位置:主页 > 技术教程 > Html5技术 >

      [css3]css3媒体查询@media在响应式web设计中的应用

      时间:2019-02-12 19:06阿酷
      [css3]css3媒体查询@media在响应式web设计中的应用

      调用方式1:

      <link rel="stylesheet" href="style.css" media="screen and (min-width: 768px)">

      1. 注:media="screen and (min-width: 768px)" 
      2.  
      3. ---screen-------------------------------- 
      4. 引用 screen (缺省值),提交到计算机屏幕; 
      5. print, 输出到打印机; 
      6. projection,提交到投影机; 
      7. aural,扬声器; 
      8. braille,提交到凸字触觉感知设备; 
      9. tty,电传打字机 (使用固定的字体); 
      10. tv,电视机; 
      11. all,所有输出设备 
      12.  
      13. ---min-width: 768px--------------------- 
      14. min-width 屏幕最小宽度 

      调用方式2:

      1. <style> 
      2.  // 阿酷TONy 
      3.    @media screen and (min-width: 768px) { 
      4.    .class { background: blue; line-height:50px; } 
      5.    } 
      6.    </style> 

       

      热门文章推荐

      请稍候...
      彩票软件开发公司