在WordPress主题开发的时候如何让布局兼容多个终端，做到手机、电脑、平板自适应呢？

在这里分享一种响应式布局解决方案，在主题的style.css文件中加入如下代码：

/*手机*/

@media screen and (max-width:600px){
/*这里写手机端的样式*/
}

/*平板*/

@media screen and (min-width:600px) and (max-width:960px){
/*这里写平板的样式*/

}

/*PC*/

@media screen and (min-width:960px){
/*这里写电脑端的样式*/
}

响应式布局的优点是：1、面对不同分辨率设备灵活性强。2、能够快捷解决多设备显示适应问题。

缺点：不能完全兼容所有浏览器，代码累赘，加载时间加长。

原理：简单点说响应式布局它是通过CSS中Media Query（媒介查询）@media功能，来判断我们的终端设备宽度在多少像素内，然后就执行与之对应的CSS样式。