知更鸟begin主题如何美化面包屑导航栏

2019年7月6日14:46:06 6 510 views 846字阅读2分49秒

在我们众所周知的WordPress主题多不胜数,但真正让我们喜欢的却没有几个。所以,大多数朋友们安装WP主题后都会尝试着网站找各种教程进行站内美化,为的就是让自己的网站看起来别具一格,可以很好的吸引着大伙的眼球。叶忠文之前也是用过好多WP博客类型的主题,记得第一次用的是翠竹林的WP博客主题,但后来因为没有那么多完善狗能,加上现在也倒闭了所以改用知更鸟Begin主题。

知更鸟begin主题如何美化面包屑导航栏

虽说现在市面上用的人比较多吧,但自己还是挺喜欢的,因为每个人的想法不一样我们便可美化出不一样的效果。虽说其美化的特点多之数不胜数,但如果没有用心美化也还是会丑的一逼。今天我就闲着无聊在星光博客里看到一个WordPredd面包屑导航的美化,没想到这效果还是挺不错的,所以就作者尝试稍微的修改,感觉其效果还是非常的不错的。

之前虽说也看到了类似这种面包屑教程,但或多或少会有点bug问题存在,经过这个修改后的方法,一直没发现什么问题。因此在这里拿来跟大家分享分享,希望对此有所爱好的朋友们能够喜欢。

一、修改style.css文件

打开主题根目录下的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;
    }

二、美化前后效果对比

美化前

知更鸟begin主题面包屑导航栏美化前

美化后

知更鸟begin主题面包屑导航栏美化后

如此一来便大功告成! :grin: :grin: :grin:

叶先生
  • 本文由 发表于 2019年7月6日14:46:06
如何快速切换WordPress里的背景图 WordPress

如何快速切换WordPress里的背景图

用过WordPress主题建站的人多半都切换过背景图,就拿本人来说,之前用鸟哥这款Begin主题的时候,就为了追求各种美化加过网站背景图与评论区背景图,还加过自定义鼠标样式,但后期还是因为想要简单简洁...
如何替换WordPress博客的自定义栏目值 WordPress

如何替换WordPress博客的自定义栏目值

我们都知道如果之前添加的自定义栏目值,例如说:附件或者图片链接的地址发生改变,修改起来都是比较麻烦的。好久没进鸟哥的官网看了,今天进去看到这么一个教程感觉挺实用的,里面有篇文章讲到附件或者图片链接的地...
WordPress网站如何更换域名的详细教程讲解 WordPress

WordPress网站如何更换域名的详细教程讲解

WordPress网站如何更换域名?使用WordPress主题建站这么长时间以来,见过很多站长不停的更换网站域名,但不会更换里面的内容。其实这个方法不算新颖,因为在这个方法之前,鸟哥的Begin主题里...
修改数据库密码后导致网站无法打开该怎么解决? 网站建设

修改数据库密码后导致网站无法打开该怎么解决?

今天无缘无故不知道发什么癫,一时兴起,想统一下阿里后台的登录密码,接着把FTP密码也给重置了遍,后面想了下,要不就把数据库密码也统一下吧。统一好了后方才发现网站打不开了,顿时有点百思不得其解,以前用织...
匿名

发表评论

匿名网友 填写信息

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

评论:6   其中:访客  3   博主  3
    • 简单生活 简单生活 来自天朝的朋友 谷歌浏览器 Windows 10 甘肃省武威市 电信 1

      嘿,美化前后的图片放反了吧!!!!!!

        • Joson Joson 来自天朝的朋友 火狐浏览器 Windows 10 广东省东莞市 鹏博士长城宽带

          回复 简单生活 还真的是,谢谢提醒

        • 猫叔 猫叔 来自天朝的朋友 谷歌浏览器  Android 7.1.2 OC105 Build/N2G47H 安徽省安庆市岳西县 电信 3

          这难道不是公告吗?面包屑呢?

            • Joson Joson 来自天朝的朋友 火狐浏览器 Windows 10 广东省东莞市 鹏博士长城宽带

              回复 猫叔 这虽说可以说是公告,但准确来说是面包屑导航

            • 仙踪小栈 仙踪小栈 来自天朝的朋友 谷歌浏览器 Windows 7 安徽省淮北市 电信 2

              效果的确好看多了,所以我也弄了

                • Joson Joson 来自天朝的朋友 火狐浏览器 Windows 10 广东省东莞市 鹏博士长城宽带

                  回复 仙踪小栈 我没弄,我觉得自带的也挺不错的