WordPress柒比贰7b2主题模板H标签美化修改

前言

用好H标签一方面可以有效地帮助网站访问者快速理解文章结构,获取文章主要内容;另一方面如果我们后期想为文章做个目录的话,使用H标签也可以方便我们后期自动生成目录

H标签页可以更鲜明的掌控文章权重,有利于SEO优化

对于7b2主题的h标签有些过于简单,所以博主将其进行了些美化,今天把代码分享出来给大家,当然,其他模板也同样支持得,只要自行修改css即可

一般来说,1级标签基本用不到,所以这里没有进行修改,也没有对6级标签进行修改,想要改的可以自行修改

修改方式

将下列代码替换主题样式表中原本的h标签样式,可以搜索关键词entry-content来替换即可

.entry-content h2{
   	font-weight: bold;
	background-color: #f6f6f6;
	margin: 20px 0;
	border-bottom: 0px solid #FF1493;
	padding: 5px 12px;
	border-left: 5px solid #FF1493;
	border-radius: 0rem;
	margin: 12px 0px;
}
.entry-content h3 {
	font-weight: bold;
	background-color: #f6f6f6;
	margin: 20px 0;
	border-bottom: 0px solid #4169E1;
	padding: 5px 12px;
	border-left: 5px solid #4169E1;
	margin: 12px 0px;
	border-radius: 0rem;
}
.entry-content h4 {
	font-weight: bold;
	background-color: #f6f6f6;
	margin: 20px 0;
	border-bottom: 0px solid #3CB371;
	padding: 5px 12px;
	border-left: 5px solid #3CB371;
	margin: 12px 0px;
	border-radius: 0rem;
}
.entry-content h5 {
	font-weight: bold;
	background-color: #f6f6f6;
	margin: 20px 0;
	border-bottom: 0px solid #FFC0CB;
	padding: 5px 12px;
	border-left: 5px solid #FFC0CB;
	margin: 12px 0px;
	border-radius: 0rem;
}

值得一提的是其中 border-radius: 0rem; 为重新定义一下样式不要圆角,可自行去掉

© 版权声明
THE END
喜欢就支持以下吧
点赞0赞赏
分享
评论 抢沙发