一个一般的自适应显示的三栏网页，当用不一样的终端来查询这个页面时，会依据几种线端来显示不一样的样式。在电脑上是三列，在iPad上也应该是三列，在大屏手机上是三行，在屏幕小于320px的手机上只显示主要内容，隐藏了次要元素。大家了解，在不一样的设施中，浏览器的窗尺寸可能是不一样的。假如只针对某种窗口尺寸来网站设计，在其他设施中呈现该网页时就会产生不少问题:假如针对不一样的窗口尺寸制作不一样的网页，则要制作的网页就会太多。为知道决这个问题，在CSS3中加入了MedisQueries模块(媒体查看)，它是制作响应式布局的-个利器，用这个工具大家可以非常便利、快捷地设计出各种丰富的、实用性强的界面。在MediaQueries模块中允许添加媒体查看表达式，用以指定媒体种类，然后依据媒体种类选择应该用的样式。换句话说，允许在不改变内容的状况下，在样式中选择一一种页面的布局以精确地适应不一样的设施，从而改变客户体验。网站设计者仅需针对不一样的浏览器窗口尺寸来撰写不一样的样式，然后让浏览器依据不一样的窗口尺寸来选择用不一样的样式即可。 
到现在为止，MediaQueries模块得到了Firefox、SafariChrome及Opera浏览器的支持。移动终端上一-般都是对CSS3支持最好的高级浏览器，无需考虑响应式布局的媒体查看兼容问题。IE8及以下版本浏览器不支持媒体查看，虽然也有非常多种解决方法，几乎都是通过下载Javascript插件来达成，但没必要去解决这个问题，由于小屏幕显示都是在手机端用，IE低版本只须按正常PC端页面显示页面布局即可。在开发中只须拖动浏览器就能触发判新条件，测试的时候无需去找一堆手机，只须把我们的浏览器窗口缩小到定尺寸就能了。另外，还有一个很好的在线Web工具(开源的，直接从hp:gi//conioloieiponisvaer下载)，里面提Responsivator真了根不同尺寸的屏幕的展示发果，仅需提供个UR，出可以看到网站在不同服幕中的显示成效。网站式公司网站建设 
