随着移动端设备的普及，越来越多的人在移动设备上浏览网页。然而传统的网页是基于PC来布局的，不适合在移动端观看，由此，响应式网站逐渐发展并得到了普及。
     响应式布局，顾名思义就是一个网站可以在pc端和移动端浏览，并且根据这两种设备的不同特性展现出不同的样式结构。简言之，是一个网站能够兼容多个终端——而不是为每个终端做一个特定的版本。
实现页面响应式主要使用到的是css3中的媒体查询属性，即@media属性。通过设置该属性，可以在对应查询的媒体中设置对应的样式，来达到在不同设备上面显示对应页面结构和外观。一般在设置媒体查询属性时，将媒体分为1200px以上的大分辨率设备，992~1200px的中等分辨率设备，768~992px的平板设备，以及小于768px的手机设备。当然，这些分界点也可以根据实际需要进行修改。

                                          
      响应式网站的优势在于多终端视觉和操作体验非常风格统一，并且响应式网站兼容当前及未来新设备 。响应式web设计中的大部分技术可以用在WebApp开发中，能够节约开发成本，维护成本也降低很多。响应的方式主要有两种，一种是移动优先，即在设计的初期就要考虑的页面如何在多终端显示；另一种则是渐进增强，这样做能充分发挥硬件设备的最大功能。
      在实际开发中，也会使用一些响应式框架，比如bootstrap等。bootstrap框架的网格系统非常适合于制作响应式网站。在网页中经常会有一些元素并排显示，然而在移动端并排显示影响显示效果，我们需要让他们单排显示。在之前，我们需要使用媒体查询，在不同的设备中写不同的样式。如果使用bootstrap的网格系统，我们仅需要添加简单的类名就能实现这一效果。bootstrap中也有许多自带的样式和插件，使用起来也十分方便。

                                           
      当然响应式网站具有一定的缺点，比如在低版本浏览器兼容性有问题。在移动带宽流量方面，相比较手机定制网站，流量稍大，但比较加载一个完整pc端网站显然是小得多。代码累赘，会出现隐藏无用的元素，加载时间加长。兼容各种设备工作量大。所以对于重内容的网站，例如形象展示，则比较适合使用响应式web设计，然而对于重功能的网站，如电子商务类，则更推荐使用独立移动网站。                     
      虽然存在一些局限性，但对于大部分展示型网站，响应式网站无非是最适合的选择。