XOOPS风格修改简易教程
类别: Xoops Theme
作者: ezsky http://xoops.org.cn/modules/newbb/viewtopic.php?topic_id=6039&forum=16
日期: 06月30日
实例部分（一） insraq于 2006.2.12／insraq.org
XOOPS版本：2.2.6中文版风格：xmt（XOOPS自带）修改使用软件：Editplus , Topstyle
XOOPS版本：2.2.6中文版风格：xmt（XOOPS自带）修改使用软件：Editplus , Topstyle
摘要: 实例部分（一） insraq于 2006.2.12／insraq.org
XOOPS版本：2.2.6中文版风格：xmt（XOOPS自带）修改使用软件：Editplus , Topstyle
目的：修改这个风格，目的是为了让大家知道怎么修改一个新风格，怎么样通过分析，了解一个新的风格。所以，每条结论的后面，我都会写上怎样通过分析确定这个结论的。
修改这个风格，主要需要修改的文件有： theme.html以 及 css/style.css。 首先分析 theme.html，用 Editplus打开文件， 找到 57-64行：
第 59行的代码定义了 header图片，也就是 logo。这个可以通过查看图片来确定。
地 62行的代码定义了导航栏，这个可以通过“ navigbar”这个关键词确定，通过这一行代码，我们还可以确定，修改导航栏，需要修改 “navigation/theme_usernav.html”这个文件。从 66-138行，定义的都是风格的各个区块，一般没必要修改。这个可以从风格作者的注释中确定，也可以看 “content”这个关键字确定。对 theme.html的修改大抵就这些。对 CSS的修改可以说是修改的重中之重。下面我们用 Topstyle打开 css/style.css
下面说一下怎么样分析出来该修改什么：方法一：根据常识。例如，第 2行的“ body”，一看就可以确定是控制主要文字的。第 16行的“td#leftcolumn div.blockTitle”也可
以确定是控制左边区块标题的。
方法二：根据 theme.html。例如，如果你确定不了“#header-l”和“#header-r”的具体作用，可以看看 theme.html的第 57行的“
XOOPS版本：2.2.6中文版风格：xmt（XOOPS自带）修改使用软件：Editplus , Topstyle
目的：修改这个风格，目的是为了让大家知道怎么修改一个新风格，怎么样通过分析，了解一个新的风格。所以，每条结论的后面，我都会写上怎样通过分析确定这个结论的。
修改这个风格，主要需要修改的文件有： theme.html以 及 css/style.css。 首先分析 theme.html，用 Editplus打开文件， 找到 57-64行：
第 59行的代码定义了 header图片，也就是 logo。这个可以通过查看图片来确定。
地 62行的代码定义了导航栏，这个可以通过“ navigbar”这个关键词确定，通过这一行代码，我们还可以确定，修改导航栏，需要修改 “navigation/theme_usernav.html”这个文件。从 66-138行，定义的都是风格的各个区块，一般没必要修改。这个可以从风格作者的注释中确定，也可以看 “content”这个关键字确定。对 theme.html的修改大抵就这些。对 CSS的修改可以说是修改的重中之重。下面我们用 Topstyle打开 css/style.css
下面说一下怎么样分析出来该修改什么：方法一：根据常识。例如，第 2行的“ body”，一看就可以确定是控制主要文字的。第 16行的“td#leftcolumn div.blockTitle”也可
以确定是控制左边区块标题的。
方法二：根据 theme.html。例如，如果你确定不了“#header-l”和“#header-r”的具体作用，可以看看 theme.html的第 57行的“
”代码，很容易知道，它就是控制 header样式的，也就是实现 header顶端的那两个“圆角”。方法三：根据样式。例如，对于 80行的“div.errorMsg”假如你确定不了，可以看看 Topstyle的输出样式（如下图），
[img] http://xoops.org.cn/uploads/article/image/20080630072505.jpg[/img]
很容易辨别，它就是那几个信息提示。方法四：试还有其他的不能辨别的，可以通过尝试一下，在 XOOPS 看看效果来辨别。通过以上四个方法，再加上一些美工基础，修改风格应该不成问题。关于 style.css文件的详细内容，可以参见：《 XOOPS风格文件 style.css不完全解释》：
http://xoops.org.cn/modules/newbb/vie ... php?topic_id=3750&forum=4
[img] http://xoops.org.cn/uploads/article/image/20080630072505.jpg[/img]
很容易辨别，它就是那几个信息提示。方法四：试还有其他的不能辨别的，可以通过尝试一下，在 XOOPS 看看效果来辨别。通过以上四个方法，再加上一些美工基础，修改风格应该不成问题。关于 style.css文件的详细内容，可以参见：《 XOOPS风格文件 style.css不完全解释》：
http://xoops.org.cn/modules/newbb/vie ... php?topic_id=3750&forum=4
文章管理 V1
URL: http://xoops.org.cn/modules/article/view.article.php/c6/81