很早就知道True Blue
这个K2 style了,设计得的确非常好看。5月份初识,推荐给了几个朋友,自己却一直没用。现在,K2 0.9已经发布了,True Blue也随之更新到1.3.3,也变得越来越漂亮了。所以,今天开始换用True Blue style,并把我自己的CSS文件整合进去。
K2模版本身有个style.css文件,里面放着K2自己的CSS。用户是挑剔的,谁不想自己的K2看起来更与众不同呢?所以,很多人会修改K2的style.css文件。为了免去用户升级K2时重新修改style.css文件之苦,K2设置了style功能,允许用户把自己的CSS代码写入一个CSS文件放入K2的style目录里,并在后台提供了选项,可以很方便的选择当前使用哪个CSS文件,此为"style"。 我以前就是自己写一个style自己用的,不过有很多人做了很漂亮的style放在网上供大家使用,比如这个True Blue。但是,我们也不想受限于这个style,还想在它的基础上再加上自己的CSS代码,该怎么办呢?True Blue本身提供了一个可定制的办法,就是在主文件里import一个custom.css文件。只要把自己的CSS写到这个custom.css文件里,访问者在访问Blog时在读取K2的CSS和True Blue的CSS之后,也会读取custom.css文件里我们定制的CSS代码。当升级True Blue的时候,只要不覆盖网站上的custom.css文件就可以了。不过import是在文件开头import的,所以只能添加CSS,要是想覆盖就必须加important。我想修改一下,让custom.css在主CSS之后载入。
Update:查了一下,@import语句载入的CSS文件是在原CSS之后处理的。True Blue里也是在core.css之后import custom.css的。具体的问题是CSS的匹配问题,True Blue的CSS里用了#page #primary .entry-content,而我的CSS里学着K2用了#primary .hentry .entry-content。虽然我的CSS后解析,但是前者的匹配度更高,所以前者生效,覆盖了后者。
True Blue还提供了对IE的支持,不仅修正了在IE下的显示效果,还把所有图片文件都备了两份,一份给Firefox和Opera等非IE浏览器用的有透明背景的PNG文件,一份给IE用的jpeg和gif文件,这样就不会象原版K2那样,在IE下小图标的透明部分显示成灰色了。另外,作者steveo还提供了各个图片文件的psd原文件,使用者可以自行用PhotoShop修改。psd文件做的非常好,在PS里直接把相应地方的文字修改成自己的,颜色和特效都不会变,真的是很方便。看看页面上方的标题图片,只用了半分钟就改好了哦。修改完保存成PNG文件,覆盖原来的文件就可以了,有些则是对应IE下显示效果的,存成jpeg文件覆盖即可。
具体的效果看我的Blog就知道了,也可以去看看True Blue Screenshots。如果你想用它的话,记得True Blue只是一个style,它要在K2模版下才能工作哦。steveo这个人好像很厉害耶,《true blue updated for k2 0.9》一文中第一个评论者是matt,这个名字好熟啊,难道是WordPress的开发者之一Matt Mullenweg?还有K2在页面下面显示当前style的那段代码也是steveo提供的,以前在K2的设置页面还有"(code by steveo)"这样的字样,不过最近给去掉了。
Update:照着花儿开了的CSS,加了这么一段:
::-moz-selection{
background: #c8c8c8;
}
::selection {
background: #c8c8c8;
}
这样就可以用background和color定义选中后文字的效果了。前一个应该是Mozilla和Firefox特有的,后面的应该是CSS标准里的,Opera应该支持。不过我的IE6 SP1不支持这个效果,不知道IE7行不行。(Update:::-moz-selection时Mozilla和Firefox浏览器特有的CSS属性,::selection是CSS3里定义的,目前Firefox、Opera和IE都不支持,只有Safari和Konqueror浏览器提供了支持。[via])如果想要背景色透明还可以用transparent。
Update2:transparent的效果就好像选中和没选一样,我想到一个好用处就是用来防止copy,某些笨一点的,看到复制不上,应该就不会再动copy的主意。另外今天还发现这儿还可以填background-color:Highlight;color:HighlightText,效果可以参考这个页面。
呼~你终于改了,其实long long ago就想告诉你:你的原模版样式视觉效果实在是~不敢说~^_^
...K2默认的样式还是不错的,而且现在K2添加了Header的设置项,可以很方便的修改页首的样式。我是学计算机的,不喜欢那些花哨的东西,你看keso的Blog就不花哨。换这个style的主要原因是,左边文章部分的宽度从500px增加到了545px,空间更大些,便于容纳我的那些长篇大论,嘻嘻。
那为什么不在扩大点那,就是主体部分全页显示.没有两边的黑条.这样不是更宽敞.还是我用IE所以显示这样?
我就喜欢用全宽的,不想旁边空出来那么多浪费了.不然写长文宽窄窄的.然后往下翻个N屏幕.个人感觉看着不舒服.
太宽也不好的,没有人弄成一栏 全页显示的。一般是三栏配全页显示,两栏配全页,比如keso在donews的Blog,或者两边留空,比如我的。一栏的一般都是两边留空的,不然太难看了。
你看sina和sohu的新闻也不会太宽,sina的新闻字体大,宽度也只有560px。keso的字体是13.3px,文章宽度也只有600px。没有人弄宽度为1024的文章的。现在的屏幕大都是17寸或者19寸,看点东西要把眼睛从左边一直移到右边,很累的。把文章集中于某一部分,对于阅读者是很方便的,尤其是我这种字体只有12px的。
呵呵!这次的好看多了!
顺便问一下我的K2侧边栏模块为什么添加后无法删除?是不是哪里没有设对?
不知道呀,我的K2添加了侧边栏模块都不显示,不过移除倒是没问题。
这个侧边栏模块到底该怎么用呀?
像询问个问题,如何修改k2风格文件使评论页中的评论 feed Trackback 地址 2006-08-18 5:40 pm 以及Yskin's Blog is powered by WordPress 2.0.4 and K2 Beta Two svn
Current style is True Blue 1.3.3 by Steve Lam
Host by百优科技
等文字不至于太小啊?
我现在是加是加上了,但是删不掉!一删就会出错!现在我的页面上还有错误呢!
添加是填入名称后选择module最点击添加按钮!我是这样加的!
我已经用SVN更新到最新版了!还是老问题!
今天K2那边又修改了两个文件!注释如下!和侧边栏无关!
/*Fixed tiny font issue with comment form. Issue #97*/
/trunk/style.css
/*Adding wp_get_archives that was previously removed. */
/trunk/header.php
改CSS咯,把几个地方的字体调大些。
评论右上角的头像我这里显示不出来 /http://www.gravatar.com/?
呵呵,yskin大哥,借用你的css学习一下,……我自己实在是写不出好看的页面了……我把你的custom.css下来了,正在学习中,也许以后会借鉴一部分,不介意吧……
被好多人用过custom.css了,尽管用好了,copyleft的,我还加了好多注释方便理解呢。
yskin...true blue的custom.css能给我一份吗,我主要想修改一下字体大小,摸不到门路。
seob rxbhyi ygpdnihc ymjirtz rtgywqx zgicrebn uqdtgmkp
shjbcr ueozd ozncr dutlw khjfpxrbz jdoxt jgkvtuos
prfg tvpyk wkqzlo byetzxv rchweky qgfejobt hzrpi