新版Begin主题侧边栏和两栏标题美化

  • 28
  • 946人已阅
  • A+
所属分类：WP建设
摘要

这个美化教程原先是在朱曙明博客看到的，他文章里提到6.27之后的begin主题无法使用这个教程，我就自己琢磨琢磨，看了下css，对比对比，就让我琢磨出了新版本的美化教程。

新版Begin主题侧边栏和两栏标题美化

将侧边栏标题 sidebar h3  位置css修改成如下所示：

  1. #sidebar h3, #sidebar-l h3 {
  2. background: #fff;
  3. height: 37.5px;
  4. line-height: 37.5px;
  5. border-bottom: 1px solid #e2e1e1;
  6. margin: 0 20px 0 20px;
  7. text-align: center;
  8. font-size: 1.8rem;
  9. letter-spacing: 4px;
  10. color: #606777;
  11. }

按照以上css修改后，标题栏位置还多了一个 .title-i  ，后台找到 .title-i  将其隐藏：

  1. .title-i {
  2.     float: left;
  3.     width: 16px;
  4.     display: none;
  5. }

将 .title-i 隐藏后，如下效果图：

新版Begin主题侧边栏和两栏标题美化

然后，如果使用杂志布局的会发现两栏位置前面的标题ICO也会不见了。

接着，将 .cat-box .cat-title a  位置css修改成以下即可。

  1. .cat-box .cat-title a {
  2. float: left;
  3. width: 98%;
  4. margin-left: 20px;
  5. color: #606777;
  6. font-size: 1.8rem;
  7. }

要注意font-size: 1.8rem;是原先的教程中没有的，新版本的Begin主题需要再加入这条代码，不然标题很小。

以上就是美化侧边栏和两栏标题的教程，具体效果请移步至本博客首页查看。

发表评论

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

目前评论：28   其中：访客  15   博主  13

    • avatar 80mt.com 来自天朝的朋友 谷歌浏览器 Windows 8.1 广西梧州市 联通 0
      回复 2018年11月28日 20:34  14楼

      begin这个主题我也在用，功能非常强大！

      • avatar 林三 来自天朝的朋友 谷歌浏览器 Windows 7 湖北省 电信 3
        回复 2018年11月5日 08:40  13楼

        圆角有圆角的好，我个人比较方点的，有立体感的说。

          • avatar 青山 博主 来自天朝的朋友 谷歌浏览器 Windows 7 江西省萍乡市 电信
            回复 2018年11月7日 13:37  1层

            @林三 恩，+1

          • avatar 堆爱博客 来自天朝的朋友 火狐浏览器 Windows 10 贵州省铜仁地区 电信 2
            回复 2018年8月31日 15:39  12楼

            侧边栏整成圆角看着应该舒服一些。

            • avatar 区块链 来自天朝的朋友 谷歌浏览器 Windows 10 云南省昆明市 电信 4
              回复 2018年8月14日 09:58  11楼

              还是挺漂亮的。

              • avatar 久伴博客 来自天朝的朋友 谷歌浏览器 Windows 7 湖北省武汉市 电信 3
                回复 2018年8月13日 11:20  10楼

                我偷走了 :grin:

                • avatar 最值买 来自天朝的朋友 谷歌浏览器 Windows 10 广东省湛江市 电信 0
                  回复 2018年8月11日 15:55  9楼

                  同样是begin主题 好久没更新了

                  • avatar 大国小事 来自天朝的朋友 谷歌浏览器 Linux 湖北省武汉市 联通 0
                    回复 2018年8月11日 11:36  8楼

                    确实不错，字数少了

                    • avatar boke112导航 来自天朝的朋友 谷歌浏览器 Windows 7 广西南宁市 电信 5
                      回复 2018年8月10日 08:54  7楼

                      博客在于折腾，不错

                      • avatar 老杨 来自天朝的朋友 谷歌浏览器 Windows 7 广东省肇庆市 电信 2
                        回复 2018年8月9日 11:34  6楼

                        生命不息，折腾不止！

                          • avatar 青山 博主 来自天朝的朋友 搜狗浏览器 Windows 7 江西省萍乡市 电信
                            回复 2018年8月9日 13:08  1层

                            @老杨 人生需要折腾！

                          • avatar nice 来自天朝的朋友 QQ浏览器 Windows 10 广东省东莞市 (南城区)电信 3
                            回复 2018年8月9日 08:00  5楼

                            前端大佬666

                              • avatar 青山 博主 来自天朝的朋友 搜狗浏览器 Windows 7 江西省萍乡市 电信
                                回复 2018年8月9日 08:03  1层

                                @nice 前端是什么我都不知道 :???:

                              • avatar 个人博客 来自天朝的朋友 谷歌浏览器 Windows 7 中国 移动 5
                                回复 2018年8月9日 01:21  4楼

                                这没看出啥东西啊。。。

                                  • avatar 青山 博主 来自天朝的朋友 搜狗浏览器 Windows 7 江西省萍乡市 电信
                                    回复 2018年8月9日 08:03  1层

                                    @个人博客 字体变大了，侧栏的标题居中了

                                  • avatar 云顶天的博客 来自天朝的朋友 谷歌浏览器 Windows 7 广东省广州市天河区 /黄埔区电信 4
                                    回复 2018年8月8日 22:51  地板

                                    看起来比以前是大气一些了~以前那样子感觉像是几年前的网站风格~

                                      • avatar 青山 博主 来自天朝的朋友 搜狗浏览器 Windows 7 江西省萍乡市 电信
                                        回复 2018年8月8日 22:52  1层

                                        @云顶天的博客 哈哈几年前的没看过，不过确实改了好看

                                      • avatar 爱的合一 来自天朝的朋友 QQ浏览器 Windows 10 上海市 移动 0
                                        回复 2018年8月8日 22:45  板凳

                                        都加上高考倒计时了 厉害啊

                                        • avatar 杨景文 来自天朝的朋友 谷歌浏览器 Windows 10 北京市 移动 5
                                          回复 2018年8月8日 22:10  沙发

                                          没看出啥不同 :evil: 可能年纪大了，本身视力又不好，觉得和之前一样的

                                            • avatar 青山 博主 来自天朝的朋友 搜狗浏览器 Windows 7 江西省萍乡市 电信
                                              回复 2018年8月8日 22:14  1层

                                              @杨景文 啊啊啊，伤心啊，你这老腊肉

                                                • avatar 杨景文 来自天朝的朋友 谷歌浏览器 Windows 10 北京市 移动 5
                                                  回复 2018年8月12日 21:34  2层

                                                  @青山 我说咋好多天没收到你的回复邮件了，竟然进了我的垃圾箱，你之前是不是用的163邮箱，现在换成域名邮箱了？我记得之前把你添加到通讯录了的。

                                                    • avatar 青山 博主 来自天朝的朋友 QQ浏览器 vivo Y85 Build/OPM1.171019.011 江西省南昌市 电信
                                                      回复 2018年8月12日 21:35  3层

                                                      @杨景文 对的，企业邮箱