怎样制作WordPress响应式主题/模板？
这个年代，没有用WordPress做过网站的根本不敢说自己做过网站。WordPress是什么？WordPress是世界大名鼎鼎的网站内容管理系统（或者说博客/Blog系统），简称WP。据相关调查显示，2015年WordPress的市场份额全球高达48%，蝉联全球开源web网站系统冠军。并且还在快速的增长中…综观国内开源的CMS，现在真正存活，保持更新的真心没有几家了。曾经叱咤风云的动易、dedecms、phpcms、帝国cms、phpwind、discuz等等，尚能饭否？
工具/原料
HTML5
CSS3
现代浏览器，如：Chrome、Firefox、Edge等
相关推荐：《WordPress教程》
方法/步骤
1.简单的说就是，在网页头部（<head> </head>）之间加入以下查询代码：
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
2.然后在CSS文件中，加入媒介查询元素，如：
@media screen and (max-width:480px) {
//当浏览器屏幕小于480px时，此代码块生效
}
@media screen and (min-width:481px) and (max-width:720px) {
//当浏览器屏幕大于480px小于720px时，此代码块生效
}
@media screen and (min-width:721px) and (max-width:1079px) {
//当浏览器屏幕大于721px小于1079px时，此代码块生效
}
其中的范围可以根据实际情况自己修改。OK，响应式与非响应式差不多就是这样的区别了，只要您懂得html+css，相信您很快就会掌握的，是不是感觉很简单呢？
3.了解了关键点，我们就可以动手制作响应式静态页面了。然后把静态页面套上wordpress相关功能函数和循环即可。当您制作好html静态页面，您可以参考《WordPress主题开发制作常用的function函数：openue.com/post/597》进行模板制作了。
注意事项
在设计过程中，css请尽量避免使用固定的宽高，多用百分比来代替，字体多用rem来代替px。
1、本文来自 iHu 投稿的内容 WordPress响应式设计：轻松制作完美适应各种设备的网站 ，所有言论和图片纯属作者个人意见，版权归原作者所有；不代表 本站 立场；
2、本站所有文章、图片、资源等如果未标明原创，均为收集自互联网公开资源；分享的图片、资源、视频等，出镜模特均为成年女性正常写真内容，版权归原作者所有，仅作为个人学习、研究以及欣赏！如有涉及下载请24小时内删除；
3、如果您发现本站上有侵犯您的权益的作品，请与我们取得联系，我们会及时修改、删除并致以最深的歉意。邮箱： i-hu#（#换@）foxmail.com
2、本站所有文章、图片、资源等如果未标明原创，均为收集自互联网公开资源；分享的图片、资源、视频等，出镜模特均为成年女性正常写真内容，版权归原作者所有，仅作为个人学习、研究以及欣赏！如有涉及下载请24小时内删除；
3、如果您发现本站上有侵犯您的权益的作品，请与我们取得联系，我们会及时修改、删除并致以最深的歉意。邮箱： i-hu#（#换@）foxmail.com
