Board logo

标题: An_Apple教你让PHPWind风格顶图（LOGO,BANNER）居中 [打印本页]
作者: An_Apple     时间: 2008-6-22 01:34 AM     标题: An_Apple教你让PHPWind风格顶图（LOGO,BANNER）居中

据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:
[复制代码到粘贴板]
<td class="banner"><a href="./"><img src="$imgpath/$stylepath/logo.png"/></a></td>
将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 编辑 ]

附件: erika.com.cn.jpg (2008-6-22 01:38 AM, 537.72 K) / 该附件被下载次数 0
http://web.meyu.net/attachment.php?aid=2383

附件: erika.com.tw.jpg (2008-6-22 01:38 AM, 508.61 K) / 该附件被下载次数 0
http://web.meyu.net/attachment.php?aid=2384
作者: 一只熊     时间: 2008-8-14 06:21 PM

学习了，但是很失望
作者: An_Apple     时间: 2008-8-18 05:15 PM



QUOTE:
原帖由 一只熊 于 2008-8-14 06:21 PM 发表
学习了，但是很失望
Why?



欢迎光临 梦游时光互联 (http://web.meyu.net/) Powered by Discuz! 4.0.0