周末两天闲着没事,绞尽脑汁也憋不出什么文章来,所以就只能折腾一下几个网站的模板了。人都是挑剔的,视觉效果这东西吧,你千万别盯着看太久,看久了就越看越丑了。加上用的外国人做的模版,对字体和排版之类的诸多不满意,也一一自己调整了下。
边栏宽度:
默认主题的边栏宽度是220px,不尴不尬的宽度。而一般的组件和广告什么的要么是提供200px的,要么是提供250px的,这就造成了边栏空间的浪费,而且经常有参差不齐的状况,很难看。调整的话,要考虑到其他元素的排布,需要修改几处代码:
#container { margin: 0 -270px 0 0;/*----原来为-240px----*/ } #primary, #secondary { width: 250px;/*----原来为220px----*/ } /* =Structure -------------------------------------------------------------- */ /* The main theme structure */ #access .menu-header, div.menu, #colophon, #branding, #main, #wrapper { width: 980px;/*----原宽度940----*/ } #footer-widget-area .widget-area { width: 250px;/*----原来为220px----*/ } /* This is the custom header image */ #branding img { width:980px;/*----原宽度940----*/ } /* =Menu -------------------------------------------------------------- */ #access { width: 980px;/*----原宽度940----*/ }
还有一些地方忘记了,反正就是边修改边刷新呗,总的来说WP控制布局的两个代码段就是Layout和Structure。大致的调整都只要从这里面去修改,一些小东西的话就自己找对应的代码吧。比如说今天把整体宽度拉宽到了980px,而顶部的图像和菜单却只有940px,还不居中,很难看,一看是用了一个margin-left让其往右移了20px,居中了,可是两边留下的空白还是很难看。所以就直接到样式表里面找到Menu段,和Header中带img的那几行,把940改成980就行了。这也是官方的主题好用的一个原因,任何东西都可以随便更改,有着非常详细的注释,而一些定制的主题则往往不便修改,难说自由。
字体:
第二个修改的是字体,不是中文字体,而是英文。发现自己博客里面的数字显示出来都他特丑,特别是9这个数字,往往和其他字母和数字都不能平齐。今天又正在改子站博客typecho的模版,看见了字体一项。这才想起来数字应该是由英文字体控制的,打开样式表看了一下WP用的字体,貌似我只认识里面的serif,其他几个字体基本上都没听说过,毕竟我也不是搞设计专业的。
解决方法:
找到Font那一段,在其他字体之前加上Verdana,Verdana即是我想用的字体,我对字体什么的不怎么了解,据说这款字体在小字状态下还能非常清晰,所以就用它了。
底部信息:
添加了谷歌、雅虎等搜索引擎都支持的网站地图。
网站广告:
去掉了原来的途牛搜索框,改用了淘宝客广告,用的是一个可以自动和网站内容匹配的API工具,从现在的效果来看,这货的匹配度比百度联盟的广告精准多了。。。。
感觉还行~
我现在用less
啥意思?
宽是趋势,屏幕分辨率决定的。
是啊,可惜现在各个浏览器的标准有不小差异,很难兼顾到