首页>文档>源码技巧>Wordpress>B2开发>7B2主题美化教程之文章H标签

此组别内的文章

需要支持?

如果通过文档没办法解决您的问题,请提交工单获取我们的支持!

7B2主题美化教程之文章H标签

7B2主题美化】让文章更加出众!基于WordPress的B2主题美化教程之文章H标签,在今天的B2主题美化教程中,我们将为您介绍如何美化B2主题的文章H标签和赞赏区域。

这两个方面都非常简单,只需要将CSS代码加入B2主题的子主题style.css文件中即可。

废话不多说,先来看一下美化效果展示吧!

7B2主题美化教程之文章H标签插图
基于WordPress的B2主题美化教程之文章H标签

美化代码

/*文章内容美化H标签 渡漳网www.dzcrv.com start*/
.entry-content > h2::before{content: '';margin-right:0;}
.single-article .entry-content > h2{
	font-weight: bold;
	background-color: #f6f6f6;
	margin: 20px 0;
	padding: 5px 12px;
	border-left: 5px solid #f25d8e;
	font-size: 21px;
}
.single-article .entry-content > h3{
	font-weight: bold;
	background-color: #f6f6f6;
	margin: 20px 0;
	padding: 5px 12px;
	border-left: 5px solid #037ad1;
	font-size: 18px;
}
.single-article .entry-content > h4{
	font-weight: bold;
	background-color: #f6f6f6;
	margin: 20px 0;
	padding: 5px 12px;
	border-left: 5px solid #3a89c3;
	font-size: 15px;
}
.single-article .entry-content > h5{
	font-weight: bold;
	background-color: #f6f6f6;
	margin: 20px 0;
	padding: 5px 12px;
	border-left: 5px solid #0061a8;
	font-size: 12px;
}
/*文章内容美化H标签 end*/

如果需要H标签 标题铺满文章

只需要把 margin: 20px 0; 改成  margin: 12px -28px;

效果演示

标题2

标题3

标题4

标题5

优化代码

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索