wordpress中非插件下实现链接表分两列显示

建站久了,认识的博友也多了,友链也自然变多了。如果是单列显示友链,当友链非常多的时候,就是个麻烦事,一长条友链表,显得很不美观。今天分享的是如何将友链表分两列显示。在百度中搜索了一遍,介绍了很多种方法,但是每种方法都没有解决我的问题,最后咨询了一位高手,这个问题得以解决。只用添加两个css样式就OK。下面我就分享一下这种方法:
首先:在firefox浏览器上安装一款firebug的插件(firefox的这款插件功能比较齐全,也有其他的类似工具,没有这个好用)
firebug安装方法:点击工具---附加组件,在搜索栏里输入firebug,找到firebug插件安装,正常安装后按提示重启浏览器,重新启动后,地址栏后会出现一个小蜜蜂的图标,说明安装成功。 其次:分析css样式
在浏览器的地址栏里输入自己的地址打开网页,比如我的博客:www.datacenterfarm.com,打开网页后按快捷键F12或是点击小蜜蜂图标下拉选择firebug界面位置,选择独立窗口状态。自动会弹出新窗口如下:
点击顶部的工具栏选择HTML,下面的代码窗口就会显示出当前页面的html代码,在body与body之间找到链接表调用部分.
可以看到链接表选择两个选择器id="linkcat-2" 和class="widget widget_links",如果有学过css样式的同学应该知道,css中一个页面下id选择器只能使用一次,所以这里我们就用id="linkcat-2" 这个选择器去写css样式,保证唯一性。
最后:在你的主题下的style.css中添加如下样式代码:

Code   ViewCopyPrint
  1. #linkcat-2 ul { overflow:hidden;}
  2. #linkcat-2 li { float:left;width:120px;}

保存样式表,这样就完成了。
可以看看我的博客现在的链接表效果就是分两列显示。这样方法只要修改样式表就行了,而且就简单两句,不需要像网上介绍的那样修改这个又要修改那个,麻烦得很。同样这样方法也可以修改文档归档或是其他分类。
今天的分享就到这里,希望对大家有所帮助。

weinxin
DC Farm小程序二维码
扫一扫添加博客小程序
Jim

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

目前评论:18   其中:访客  10   博主  8

    • avatar 站长 5

      你真是全才啊,最近课程非常多,没有时间代理博客!!!!!!!!!!

        • 激劉勇靖 激劉勇靖 Admin

          @站长 博客有空就管理管理,你还是学生以学习为重。
          我也不是全才,只是用博客遇到问题了就自己解决,熟话说得好,靠人不如靠己。你要是想也可以做到呵呵。 对了你想问一下你喜欢看我哪部分的内容???

        • avatar SEO小杨 1

          貌似这个我得好好看看,在我自己博客上改改

            • 激劉勇靖 激劉勇靖 Admin

              @SEO小杨 是的这个方式更改比较简单。只要修改CSS就可以了。

            • avatar 嘉卓 1

              这样做确实简单很多 哈哈哈 自己动代码的 自己改更快

              • avatar wuxinxinggg 3

                这个之前也搞过。。。呵呵。。。交换IP送上。。。

                • avatar 站长 5

                  我还是喜欢那些工作中的技术,但是你的那些文章即使我是一名专业学网络的我也看不懂@激劉勇靖

                  • avatar 盘先海 0

                    做测试的,幸会。

                    • avatar 站长 5

                      主要是我还没有工作经验,而且我也没学习数据存储方面的知识!@激劉勇靖

                        • 激劉勇靖 激劉勇靖 Admin

                          @站长 呵呵 经验可以慢慢积累,知识也可以一天天学。不急。

                        • avatar 门软 0

                          有点没头脑。搞不懂额。

                          • 激劉勇靖 激劉勇靖 Admin

                            术业有专攻呵呵你在你的领域肯定也强。@门软

                            • avatar 行畔博客 3

                              碉堡了!!就是这样的

                                • 激劉勇靖 激劉勇靖 Admin

                                  @行畔博客 呵呵 向你介绍的那个高手学习了一下,有我空我也做个主题玩玩。

                                • avatar ZtyHome 1

                                  学习一下
                                  多多互访