风格设计教程(2):如何改变Arsue Blog的宽度

王志勇 发表于 2012年06月13日 07:23

Arsue Blog标准版在发布时,使用的固定宽度,是经过精心设计的,网页总宽度为950像素,Blog正文区域的宽度是670像素,侧导航栏的宽度是280像素。当然,您可以改变这些值,来改变Blog的宽度。在此,需要对Arsue Blog的CSS作一下说明,您就可以改变这些值了。

本文只需要更改/t/css.php这个文件,由于改动较大,首先请在本机做调试,并且随时做备份,然后再通过FTP上传,本机调试的环境和开发软件请严格按照这篇来配置http://blog.cn.arsue.com/petal/3。css.php的页面过期缓存时间为1小时,修改完毕之后需要按F5刷新或者清空IE缓存,可以立即生效。

修改时,请用EmEditor软件,同时必须按照这一篇的最后一段对EmEditor软件进行设置:http://blog.cn.arsue.com/petal/3。然后,使用IE浏览器进行预览,请按F5刷新。

打开css.php,请找到这一行:

#el,#nd{width:950}#n1{width:670}#n2{width:280}#nr{width:135}

说明如下:

  1. #el,#nd这里,是页面的总宽度。
  2. #n1是Blog正文区域的宽度,#n2是侧导航栏的宽度。#n1和#n2相加的和,必须等于#nd的值,例如默认的670+280=950。
  3. #nr的值,是用于侧导航栏分2栏时,每栏的宽度,例如友情链接、Blog存档这里。需要注意的是,侧导航栏的宽度默认为280像素,在《风格设计教程(1)》一文中提到的#ne的值,设置侧导航栏的右边距为10像素,所以#nr的值最大只能是(280-10)/2=135,如果超过这个值,页面就会出现侧导航栏跑到网页下方的情况。可以是135,或者小于135。

css.php中#na和#ne的值,在《风格设计教程(1)》中有提到,它们默认的值如下:

#na{padding:0 15 0 10}#ne{padding:0 10 0 0}

#na{padding:0 15 0 10}表示Blog正文区域的右边距是15像素,左边距是10像素;#ne{padding:0 10 0 0}表示侧导航栏的右边距是10像素。这2个值是比较合理的,通常无需更改。

0条评论:

发表评论:
名字: (*必填)
博客: (可省,仅限于Blog地址)
验证码: r68e85v59i82s12e2 (*必填)

正文:

    记住信息? 否   回复第

直接发送Trackback

程序简介:Arsue是一个快速、超低负载、易于安装和备份的博客程序,可快速地运行在低价的虚拟主机,PHP+NoSQL构架,核心程序5K以内,主程序20K以内,全动态页面,国内外大多数的Linux+Apache+PHP的主机均可运行。获得此程序,可以在这里预定

最新的评论:
Arsue教程(4):如何关闭/开启评论
Arsue教程(3):Arsue Blog程序如何第一次安装
Arsue教程(20):参数设置 - 两次发帖的时间间隔
Arsue教程(13):参数设置 - 按月存档管理
Arsue教程(7):如何更改Blog文档的路径
Arsue教程(19):如何添加友情链接
Arsue教程(31):如何在一个分类/标签下添加一篇文章
Arsue教程(25):“在线升级”使用说明(图解)
Arsue教程(30):文章分类和标签
Arsue教程(29):最新评论审核平台

分类:
Arsue教程 | Arsue的属性 | 程序艺术谈
风格设计教程 | Arsue程序更新

Blog存档:

Copyright © 2012 arsue.com 版权所有。Arsue是一个基于PHP+NoSQL构架的快速、超低负载的Blog程序,它可以节省您每年50%以上的服务器费用。