WordPress twentytwelve主题修改页面宽度
24 Aug 2013Wordpress twentytwelve theme以简洁取胜,但是这个主题是固定页面宽度的(默认值为960),如果网站上放置的东西多一点就会显得拥挤不堪,破坏了其整体整洁性,下面介绍的方法可以很方便的更改这个主题的宽度:
-
打开主题的style.css文件(可以使用WP后台编辑也可以直接进主机目录修改 一个可能的路径 /var/www/wordpress/wp-content/themes/twentytwelve
-
查找下面的内容(在我的主机上是在655行)
/* Footer */
footer[role="contentinfo"] {
border-top: 1px solid #ededed;
clear: both;
font-size: 12px;
font-size: 0.857142857rem;
line-height: 2;
max-width: 960px;
max-width: 68.571428571rem;
margin-top: 24px;
margin-top: 1.714285714rem;
margin-left: auto;
margin-right: auto;
padding: 24px 0;
padding: 1.714285714rem 0;
}
把其中的max-width修改成符合你要求的数值,px和rem之间的换算关系可以简单的用px / 14来计算,比如1000px / 14 = 71.4285714rem 。
- 查找下面这一段(在我的主机上是在1420行)
/* Minimum width of 600 pixels. */
@media screen and (min-width: 600px) {
.author-avatar {
float: left;
margin-top: 8px;
margin-top: 0.571428571rem;
}
.author-description {
float: right;
width: 80%;
}
.site {
margin: 0 auto;
max-width: 960px;
max-width: 68.571428571rem;
overflow: hidden;
}
同上一步修改max-width 。
Done!