换上elegant-box后,发现分类目录显示为一列,这有点看起来不舒服!分类目录和友情链接多了太占空间了,显示的老长老长的,最右边空空的,也很难看.找到一好办法来修改成为两列!!
原来只需要用ul li实现多列显示很容易。在style.css中加入下面的样式,就可以了:
.widget_categories ul{
width:261px;
display:block;
overflow:auto;
}
.widget_categories ul li{
width:87px;
float:left;
}
这样就完成了3列显示, 如果做成2列, li的宽度就应该为261/2。 当父容器中的子容器有float属性时,父容器不会按规则扩展,可以在父容器中加overflow:auto来清除浮动。
.blogroll{width:261px;display:block;/*记得清除浮动*/overflow:auto;/*兼容IE6*/zoom:1;}.blogroll li{float:left;width:130px;display:block;}.blogroll{width:261px;display:block;/*记得清除浮动*/overflow:auto;/*兼容IE6*/zoom:1;}.blogroll li{float:left;width:130px;display:block;}
以上就实现了分类目录和友情链接双列显示!效果见本BLOG!你也可以试试!
20 Responses to wordpress友情链接分类目录多列显示
xyz
Replied on: 2010 年 09 月 13 日, 10:10
挺实用的
yesadmin
Replied on: 2010 年 08 月 24 日, 18:39
可惜我不会用呵呵,抄别人的,然后做点笔记
@有点蓝
有点蓝
Replied on: 2010 年 08 月 24 日, 18:35
强大的css
小松
Replied on: 2010 年 08 月 23 日, 00:09
呵呵,这个能够充分利用空间~
学夫子
Replied on: 2010 年 08 月 22 日, 22:54
话说我以前用wp的时候也是这个主题,也按照你的分法改为双列,现在没有用了,和
admin
Replied on: 2010 年 08 月 22 日, 20:02
哪就好好收藏呀@飞猪
飞猪
Replied on: 2010 年 08 月 22 日, 19:37
嗯,以后用得着。。
admin
Replied on: 2010 年 08 月 22 日, 19:00
是的哦,呵@7cbt
7cbt
Replied on: 2010 年 08 月 22 日, 18:48
这下友情分类看起来舒服多了。
admin
Replied on: 2010 年 08 月 22 日, 18:02
管不了哪么多了,搞来搞去很累的,还有很多标准呢!@羽中
羽中
Replied on: 2010 年 08 月 22 日, 18:01
我的内页模版友链想双列来着后来发现不合标签W3C,纠结了一段时间还是作罢
yesadmin
Replied on: 2010 年 08 月 22 日, 17:58
你也可以试试@七七
七七
Replied on: 2010 年 08 月 22 日, 16:31
嗯,真的不错,一目了然!
YEE
Replied on: 2010 年 08 月 22 日, 16:09
这个好,收藏了
yesadmin
Replied on: 2010 年 08 月 22 日, 16:00
我就是喜欢懒方法@ifenwen
ifenwen
Replied on: 2010 年 08 月 22 日, 15:47
这个确实不错啊 收藏先 比我那个手动列表显示方便多了
yesadmin
Replied on: 2010 年 08 月 22 日, 15:14
折腾无罪@Jeff
yesadmin
Replied on: 2010 年 08 月 22 日, 15:13
这也这么认为,嘿嘿@游子网络
Jeff
Replied on: 2010 年 08 月 22 日, 11:49
额,我用的插件。
游子网络
Replied on: 2010 年 08 月 22 日, 10:21
这种效果不错的,看起来整齐不拥挤!