WordPress主题面包屑导航栏美化

  • A+
所属分类:wordpress主题

WordPress主题有无数个,但是真正符合自己标准的寥寥无几,所以,大多数朋友们安装主题后都会自己动手进行美化。因为本站使用的是知更鸟begin主题,其主题功能很牛叉,但是风格真是丑的一比啊,所以我们就动手自己稍微修改。今天给大家带来一个美化面包屑导航的方法,是在【语云博客】看到的,非常实用,修改也很简单。之前也看到了类似教程,但是或多或少会有点问题,这个修改后的方法,一直没发现什么问题。因此,拿来跟大家分享!

WordPress主题面包屑导航栏美化

打开主题根目录下的styless.css文件,查找下面的代码

    /** 位置 **/
    .breadcrumb {
        width: 1120px;
        height: 25px;
        line-height: 25px;
        margin: 0 auto;
        padding-left: 10px;
        white-space: nowrap;
        word-wrap: normal;
        text-overflow: ellipsis;
        overflow: hidden;
    }

将下面的代码替换掉上面的代码

    .breadcrumb {
            margin: 10px auto;
            border: 1px solid #ddd;
            border-radius: 2px;
            background-color: #fff;
            padding-top: 4px;
            padding-bottom: 4px;
            padding-left: 10px;
    }

以下是效果前后对比

效果前:

WordPress主题面包屑导航栏美化

效果后:

WordPress主题面包屑导航栏美化

此文章来自星光博客,如有不明白的地方也可去星光博客借鉴,希望喜欢的朋友也可以尽情折腾!

Joson

发表评论

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

目前评论:1   其中:访客  1   博主  0

    • 昼耕夜诵 昼耕夜诵 来自天朝的朋友 谷歌浏览器 Windows 7 广东省东莞市 电信 0

      不错!这样以来面包屑导航看起来就更美观了!