梦游时光互联客服中心 - 站长茶馆 - An_Apple教你让PHPWind风格顶图（LOGO,BANNER）居中

本帖主题: An_Apple教你让PHPWind风格顶图（LOGO,BANNER）居中

↓

SinaViVi

Friend

2008-6-22 01:34 AM No.1

发表人：An_Apple 主页个人Blog 社区短消息 Yahoo! TOP

An_Apple (Yeeher)
Discuz! user
Rank: 6

总裁俱乐部首席执行官

UID 3294
精华 2
积分 4670
帖子 4139
体力 4059
威望 49
贡献 1
阅读权限 60
注册 2006-11-27
来自上海市徐汇区
状态离线

[广告]: 新手解疑1：FTP空间各文件目录的作用

据An_Apple的观察，很多PHPWind的粉丝都在百度Baidu、谷歌Google和雅虎Yahoo!等搜索引擎里搜索这个问题：“如何将PHPWind风格的顶图LOGO（BANNER）居中？”

An_Apple同学起初遇到这个问题时，不假思索，也拼命在百度、谷歌和雅虎里搜这个问题的答案。可惜徒劳，一切都白费心机。有人说通过修改header.htm，可尽管强加了“center”代码，还是不起作用，顶图只能显示左边一部分，而右边的就是空白了。有人说我的顶图确实居中啊，在1024 x 768分辨率的显示器下，你的顶图LOGO或BANNER确实是居中的，但高分辨率的显示器，如1600 x 1200的分辨率下，看到顶图的右侧是个空白，不对称，很难看。

作为fengyu的忠实粉丝，我使用fengyu的PHPWind程序一年多了，通过不断的实践，终于摸索到了解决方法 - 通过修改/data/style/目录里的CSS样式参数，可以解决论坛顶部图片不居中的问题。

拿PHPWind官方最新发布的PHPWind 6.3版本（PHPWind 6.3正式版官方下载）的wind风格来说，An_Apple以UTF-8版程序来谈下修改方法：

1、打开wind_css.htm，查找

CODE:

[复制代码到粘贴板]

width:$mtablewidth;

这里 $mtablewidth就是全局大表格的宽度，官方默认没有设置宽度的数值，也就是随分辨率自动加宽的的宽版样式，所以你看到PHPWind的默认Wind风格的顶图就是居左的，只填满了左侧，右侧是空白，主要作用是用于添加头部广告。对于一些明星粉丝站，一般需要将顶图换成大图，盖满整个头部，位置要居中、不偏右也不偏左，这样才美观。

若想将顶部图片LOGO或BANNER居中，你可以将其设置为具体的数值，如：992（根据你做的顶图，如logo.png尺寸的宽度来设定，要保持顶图LOGO或BANNER的宽度与 $mtablewidth的具体数值一致，这样才能居中、美观），所以将以上代码替换为

CODE:

[复制代码到粘贴板]

width:992;

注意，搜索所有的$mtablewidth，并将其全部替换为992

2、将你的顶图LOGO，如logo.png替换为如992 x 299的尺寸看看，到首页刷新下，是不是顶图居中了呢？

3、An_Apple再附一个基本的技巧：顶部图片的默认名称logo.png名称的修改方法

大家知道，刚把logo做出来，从Fireworks等图片处理软件导出来的PNG文件（An_Apple一般将其以png24格式导出），如logo.png，虽然png文件的好处的是背景可以是透明的（PNG文件在IE5，IE6下解析不出透明背景），但这个文件格式占用空间实在比jpg大多了，建议使用类似logo.jpg或topbanner.jpg的名称。

修改方法也很简单，打开header.htm，搜索

CODE:

[复制代码到粘贴板]

将logo.png替换成你想要的名称即可，如logo.jpg或topbanner.jpg等等。

4、好了，修改成功后，到首页刷新下，修改后风格顶图居中了！不妨来看下鄙人论坛的演示吧：

演示一（movie风格）： http://www.erika.com.cn

效果截图：

[attach]2383[/attach]

演示二（yellow风格）：http://www.erika.com.tw

[attach]2384[/attach]

作为Meyu & PHPWind的忠实粉丝，An_Apple写本主题目的在于能让phpwind的粉丝们触类旁通，熟练掌握和更好使用PHPWind程序。至于其他风格的修改方法，大同小异，An_Apple暂不赘述了。还有问题的同志请在此留言，谢谢。

[ 本帖最后由 An_Apple 于 2008-6-22 01:41 AM 编辑 ]

附件: 您所在的用户组无法下载或查看附件

Hello, World! I'm Back!
2019.9.1