码迷,mamicode.com
首页 > 其他好文 > 详细

媒体查询

时间:2017-09-22 00:48:20      阅读:99      评论:0      收藏:0      [点我收藏+]

标签:width   max   尺寸   media   媒体查询   一个   宽度   and   兼容   

今天帮别人做了一个兼容pc端和移动端的页面,正好温习了一下媒体查询的知识。

1、@media screen and ( max-width : 600px ){

  /*屏幕宽度<=600px的样式*/

}

2、@media screen and ( min-width : 600px )and (max-width : 1000px ){

  /*屏幕宽度600-1000px的样式*/

}

3、@media screen and ( min-width : 1000px ){

  /*屏幕宽度>=1000px的样式*/

}

 

??注意:今天写样式的时候发现先写好pc端最大的尺寸的样式,然后把适配小尺寸的代码放下面,这样只需把要改的样式写到里面小尺寸代码里;

 

媒体查询

标签:width   max   尺寸   media   媒体查询   一个   宽度   and   兼容   

原文地址:http://www.cnblogs.com/zanshilei/p/7572113.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!