pjblog主体内容宽度调整,pjblog皮肤宽度调整,pjblog风格宽度调整,其实是一样的目的,不一样的说法。

第一步,找到你使用的pjblog皮肤(pjblog风格)安装文件夹,就是服务器目录skins(皮肤风格文件都在这里存放)

第二步,找到你用的是那个皮肤,找到layout.css 这个CSS文件

第三步,编辑这个CSS。

                其实改几个数值就可以了,就是调整宽度的数值。
#container #header #menu{
height:32px;
text-align:right;/*visibility:hidden;*/
margin-top: 11px;
padding: 0px;
width: 900px;   (内容框+侧栏宽度=900.就是你这款皮肤总的宽度,这里需要变化哦)
margin-right: auto;
margin-left: auto;

/*---工具条--*/
  #sidebar{float:left;width:210px;margin-left:15px;text-align:left;}  红色的数值是侧边栏的宽度

/*---主内容--*/
  #mainContent{float:left;text-align:center;width:670px;padding-top:0px;border:1px solid #ddd;}  红色的数值是内容框的宽度
  #innermainContent{margin:5px 10px 0px 0px;}
  #mainContent-topimg{height:0px;overflow:hidden;}
  #mainContent-bottomimg{height:0px;overflow:hidden;}
  .content-width{margin:auto;width:100%;}/*--主内容元素的全局宽度--*/

好了,知道怎么做了吧?首先计算看你现在的宽度是多少?你想改变为多少?为了迎合宽屏和普屏的需要,总宽度不可超过1000,一般是910、996等,做好这个加减法,你就可以看到pjblog的布局变化了。

最后,如果你的blogname那一栏,(就是pjblog顶部)和你设置好的内容宽度不符合,或者和内容框对不齐,你还可以调整一下PJblog顶部的宽度。见下表:

#container #header #blogname{
font-size:16px;
text-align:left;
font-weight:bold;
margin-right: auto;
margin-bottom: 11px;
margin-left: auto;
padding-top: 15px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 60px; blog标志距离屏幕左边的数值
background-image: url(logo.png);
background-repeat: no-repeat;
height: 55px;
width: 840px;  (红色的两个数值加起来等于你设置的整个pjblog的宽度值)

需要注意需要设计的就这几个数值,我说的很详细咯,琢磨一下自己就会了!可以只增加内容宽度不改变侧栏宽度,也可以同时增加两者的宽度。看你自己需要吧!