CSS @media媒体查询你

功能

通过media属性，可以针对要显示的页面中的设备类型（桌面、笔记本电脑、平板电脑、手机、甚至是打印机的印刷版本）来调整页面的样式。

方法一

可以在<link>中增加media属性，使用与指定设备加载样式文件,那么指定的设备就会载入这个css

?

1	<link rel="stylesheet" href="lounge.css" media="screen and (max-device-width:460px)">

方法二：

直接在css中使用，如下所示：

?

1 2 3 4 5

@media screen and (min-device-width:481px) {     div{         background-color: blue;     } }

　这个屏幕的使用方法，要放在css通用版定义css的位置的后面，这样子才可以覆盖。

关于屏幕大小的话，可以在浏览器的debug工具中用手机模式进行调试