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

  • A+
所属分类：WordPress

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

一、修改style.css文件

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

  1. /** 位置 **/
  2. .breadcrumb {
  3.     width: 1120px;
  4.     height: 25px;
  5.     line-height: 25px;
  6.     margin: 0 auto;
  7.     padding-left: 10px;
  8.     white-space: nowrap;
  9.     word-wrap: normal;
  10.     text-overflow: ellipsis;
  11.     overflow: hidden;
  12. }

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

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

二、效果前后对比

效果后：

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

效果前：

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

完美解决！

 

weinxin
星光博客 站长语录
星光博客，欢迎各位来访！这是我的QQ，扫一扫，加好友。大家一起交流博客建站技术，分享前沿资讯！

发表评论

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

目前评论：4   其中：访客  2   博主  2

    • pydata pydata 0 来自天朝的朋友 搜狗浏览器 Windows 10 上海市 电信
      回复 2018年5月16日 下午10:23  沙发

      博主，您好，请问文章标题和H标签的背景是怎么修改的？

        • BG4PGR BG4PGR  博主 来自天朝的朋友 火狐浏览器 Windows 7 山东省潍坊市 联通
          回复 2018年5月17日 上午8:59  1层

          @pydata 需要的话，自己扒一下代码就可以了。我也是从他们那里学的。 :cool:

        • . . 1 来自天朝的朋友 QQ浏览器 Android 8.1.0 Redmi 6 Pro Build/OPM1.171019.019 广东省 联通
          回复 2018年12月19日 下午12:49  板凳

          楼主标题文字不居中怎么解？

            • BG4PGR BG4PGR  博主 来自天朝的朋友 火狐浏览器 Windows 10 山东省潍坊市 联通
              回复 2018年12月19日 下午4:24  1层

              @. 文章标题文字不居中吗？