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

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

#sidebar h3, #sidebar-l h3 {
background: #fff;
height: 37.5px;
line-height: 37.5px;
border-bottom: 1px solid #e2e1e1;
margin: 0 20px 0 20px;
text-align: center;
font-size: 1.8rem;
letter-spacing: 4px;
color: #606777;
}

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

.title-i {
float: left;
width: 16px;
display: none;
}

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

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

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

.cat-box .cat-title a {
float: left;
width: 98%;
margin-left: 20px;
color: #606777;
font-size: 1.8rem;
}

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

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

Related Posts

知更鸟主题右侧滚动条按钮美化

34条评论在“新版Begin主题侧边栏和两栏标题美化”

菜鸟博客 2018年12月27日 at 20:08
样式看起来很不错，我改一下试试！
Reply ↓
1. 青山 Post author2019年1月17日 at 18:50
  @菜鸟博客很好看的
  Reply ↓
Action 2018年12月15日 at 13:47
现在才看到，这个样式比原来的样式更简约好看呀。
Reply ↓
1. 青山 Post author2018年12月15日 at 13:55
  @Action 的确会好看很多，但是新版本的begin，css有些改了，这教程应该要有所改动了
  Reply ↓
80mt.com 2018年11月28日 at 20:34
begin这个主题我也在用，功能非常强大！
Reply ↓
1. 青山 Post author2019年1月17日 at 18:50
  @80mt.com 那可不！
  Reply ↓
林三 2018年11月5日 at 08:40
圆角有圆角的好，我个人比较方点的，有立体感的说。
Reply ↓
1. 青山 Post author2018年11月7日 at 13:37
  @林三恩，+1
  Reply ↓
  1. 小航 2018年12月21日 at 02:31
    @青山楼猪，求下边悬浮导航代码。。。
    Reply ↓
堆爱博客 2018年8月31日 at 15:39
侧边栏整成圆角看着应该舒服一些。
Reply ↓
区块链 2018年8月14日 at 09:58
还是挺漂亮的。
Reply ↓
1. 青山 Post author2018年8月14日 at 10:03
  @区块链看着很美观
  Reply ↓
久伴博客 2018年8月13日 at 11:20
我偷走了 😀
Reply ↓
1. 青山 Post author2018年8月14日 at 10:02
  @久伴博客留下买路财 😎
  Reply ↓
最值买 2018年8月11日 at 15:55
同样是begin主题好久没更新了
Reply ↓
1. 青山 Post author2018年8月11日 at 18:05
  @最值买赶紧更新吧
  Reply ↓
大国小事 2018年8月11日 at 11:36
确实不错，字数少了
Reply ↓
1. 青山 Post author2018年8月11日 at 11:37
  @大国小事字数没少，大小改了
  Reply ↓
boke112导航 2018年8月10日 at 08:54
博客在于折腾，不错
Reply ↓
1. 青山 Post author2018年8月11日 at 18:05
  @boke112导航无折腾无博客
  Reply ↓
老杨 2018年8月9日 at 11:34
生命不息，折腾不止！
Reply ↓
1. 青山 Post author2018年8月9日 at 13:08
  @老杨人生需要折腾！
  Reply ↓
nice 2018年8月9日 at 08:00
前端大佬666
Reply ↓
1. 青山 Post author2018年8月9日 at 08:03
  @nice 前端是什么我都不知道 😕
  Reply ↓
个人博客 2018年8月9日 at 01:21
这没看出啥东西啊。。。
Reply ↓
1. 青山 Post author2018年8月9日 at 08:03
  @个人博客字体变大了，侧栏的标题居中了
  Reply ↓
云顶天的博客 2018年8月8日 at 22:51
看起来比以前是大气一些了~以前那样子感觉像是几年前的网站风格~
Reply ↓
1. 青山 Post author2018年8月8日 at 22:52
  @云顶天的博客哈哈几年前的没看过，不过确实改了好看
  Reply ↓
爱的合一 2018年8月8日 at 22:45
都加上高考倒计时了厉害啊
Reply ↓
1. 青山 Post author2018年8月8日 at 22:51
  @爱的合一时刻提醒自己
  Reply ↓
杨景文 2018年8月8日 at 22:10
没看出啥不同 👿 可能年纪大了，本身视力又不好，觉得和之前一样的
Reply ↓
1. 青山 Post author2018年8月8日 at 22:14
  @杨景文啊啊啊，伤心啊，你这老腊肉
  Reply ↓
  1. 杨景文 2018年8月12日 at 21:34
    @青山我说咋好多天没收到你的回复邮件了，竟然进了我的垃圾箱，你之前是不是用的163邮箱，现在换成域名邮箱了？我记得之前把你添加到通讯录了的。
    Reply ↓
    1. 青山 Post author2018年8月12日 at 21:35
      @杨景文对的，企业邮箱
      Reply ↓

Leave a Reply Cancel reply