HTML5实践 -

下一站永远

<div id="cnblogs_post_body">　　转载请注明原创地址：http://www.cnblogs.com/softlover/archive/2012/11/25/2787429.html
　　demo查看地址：http://www.webdesignerwall.com/demo/media-queries/
　　
　　CSS2允许你对特定media类型制定样式，例如针对屏幕或者打印机。css3提供了更加强大的media queries，你可以针对不同media类型设置表达式，根据不同的条件设置不同的样式。例如你可以为大屏幕设置一种样式，为mobile设置另外一种样式。这个功能相当强大，你可以不修改页面内容的情况下，为不同设备提供不同的样式效果。下面的课程我们将会介绍到一些使用该技术的站点。


　　CSS3 Media Queries

　　打开我的demo页面，调整浏览器打大小，查看页面布局变化情况。
　　Max Width

　　当页面视图区域小于600px宽度的时候，css会被使用到。
<div class="cnblogs_code">@media screen and (max-width: 600px) {  .class {    background: #ccc;  }}