wordpress博客文章页面加宽的方法

在我们开始之前，打开 Xampp Control，主题文件夹，Firefox 浏览器，IE 浏览器，index.php和style.css这两个文件。

成都网站建设哪家好，找创新互联建站！专注于网页设计、网站建设公司、微信开发、微信平台小程序开发、集团成都定制网站等服务项目。核心团队均拥有互联网行业多年经验，服务众多知名企业客户；涵盖的客户类型包括：石凉亭等众多领域，积累了大量丰富的经验，同时也获得了客户的一致好评！

第一步：设置页面总体宽度

需要把现在主题中的所有的东西（header，container，sidebar 和 footer）放入一个 自己想定义的宽度 的 DIV 标签中。

在 body 之后增加：div id=”wrapper”

在 /body 之前增加：/div

在 style.css 文件中输入以下代码：

在 CSS，# 号是通过 id 来定位页面中的元素，而点号是通过 class 来定位页面中的元素，如果你的代码是 div class=”wrapper”，那么就应该用 .wrapper 来替代 #wrapper 去定位wrapper 这个 DIV 标签。

同时保存 index.php 和 style.css 文件。刷新 Firefox 和 IE 浏览器（按 F5）查看所做的改动。

第二步：自动页面居中

把 body{} 中的 text-align: left; 改成 text-align: center;。

为什么？（我假设你使用的是 Firefox 和 Internet Explorer 6）。你的布局可能你看起来是正确的，但对于使用早前版本的 IE 用户可能不正确。还记得设置左边和右边的页边空白为自动是居中吗？但是这并不是对所有的 IE 都适用，所以 body{ text-align: center; } 是让 wrapper DIV 居中在旧版本 IE 的一种解决方案。

（随便说一下，在 Firefox 和 IE 中文本大小是不同的，我们稍后解决。）

第三步：设置 header 宽度和布局

让 Header 浮到左边并且设置它的宽度为 750px：（输入心中想要的宽度）

第四步：设置 Container 宽度和布局

让 Container 浮到左边并且宽度为 500px：（输入心中想要的宽度）

第五步：设置 Sidebar 宽度和布局

让 Sidebar 浮到左边，宽度为240px，并且给它灰色的背景：（输入心中想要的宽度）

#ffffff 是白色而background: #eeeeee; 是非常浅的灰色。我们给侧边栏增加一个背景颜色只是去查看当增加剩下的 10 像素之后的不同之处。

第六步：设置 Footer 的宽度和布局

让 Footer 浮到左边，左右两边都没有东西，并且宽度为：750px：（输入心中想要的宽度）

Header 和 Footer 的样式有什么区别呢？答案是 footer{} 中有 clear: both;。它在那儿使得 Footer 不能和它上面的东西（如 Sidebar 或者 Container）连接起来。

保存并刷新浏览器。

第七步：给侧边栏增加其余的 10 像素

给侧边栏增加其余的 10 像素的页边空白。现在侧边栏的 CSS 应该是：

保存并刷新浏览器去查看 10 像素的空白增加到侧边栏的左边了。

margin: 0 0 0 10px; 具体的意思是：上边空白为0，右边空白为0，底部空白为0，左边空白为10像素。当大小为0的时候，px 单位不是必需的。

第8步（额外的步骤）：修正 IE 的双倍页边距 bug

Internet Explorer 有个双倍页边距的 bug，这样在 IE 下，我们的页面距就是 20像素，20像素的页边距可能会破坏布局并把侧边栏挤到页面的底部，因为一个20像素的页边距使得 Container 和 Sidebar 的宽度之和为 760px 而不是 750px。为了解决这个问题，增加 display: inline; 到侧边栏。现在你的侧边栏应该是：

现在的 index.php 和 style.css 文件应该和教程源代码文件夹中的 index-lesson-11.txt 和 style-lesson-11.txt 一致了。

wordpress博客后台的编辑器如何固定宽度，默认的太宽了。写文章不舒服。需要打很长一行才换行。

后台是不能编辑的，应该是用dreamweaver打开CSS样式文件来修改宽度

如果不会的话建议按个和你心意的别的主题先用着

wordpress 修改页面宽度

修改页面宽度方法:

1.找到需要修改的页面，看书首页还是文章页，还是单独页面，栏目页等。

2.在页面找到需要修改宽度位置，可以直接按下f12，用打开的窗口剪头进行定位。

3.找到位置之后判断是在哪个div里面，最后将宽度调整并保存后，在前台刷新一下就OK。

如何进行修改具体如下:

1.找到修改对应的文件，直接在后台修改，并保存，在前台刷新就可以。

2.通过ftp进行将文件下载之后，修改在上传，再前台刷新一下就好了。

如果刷新还是原来的，那么直接对浏览器的缓存进行清理在刷新就可以。

希望可以帮到你。

分享文章：wordpress行宽 wpsword行宽
网页路径：http://ybzwz.com/article/ddchipg.html