如何调整WordPress标题样式变得更好看？

有人问魏艾斯笔记文章的标题，前面带的蓝框灰底是怎么设置的。之前没有写出来是因为觉得太简单了，怕写一篇文章字数太少，被搜索引擎识别成低质量文章，那既然有朋友来问了，我就水一篇文章，凑个字数，把这个标题的蓝框灰底教程给分享出来。

WordPress标题蓝框灰底

具体效果如下图所示，本文中的标题也能看到。

WordPress文章标题蓝框灰添加

定位到你网站后台 > 外观 > 自定义 > 额外CSS

添加如下代码：

/** 文章H标签 **/
.article-content h1, .article-content h2{
	font-weight:bold; 
	background-color: #f6f6f6;
	margin:20px 0;
	border-bottom: 0px solid #12b4f0;
	padding: 5px 12px;
	border-left: 5px solid #24b4f0;

上面包括设置标题级别，你可以根据自己需要改成 h3~h6，也可以设置字体样式、字体颜色、字体内边距、背景颜色（就是灰底）、背景边距、蓝边距离、蓝边位置、蓝边颜色等等。

你可以去网上搜索一些自己觉得更好看的样式，改的比老魏这个样式更漂亮，随心所欲啦。

WordPress 标题设置

还没完事，下一步是在你发布的文章中，把标题设置为 H2，这样就能生效。

WordPress标题样式扩展

上面就是魏艾斯笔记的文章中篮框灰底的标题是如何制作的。总结起来就三句话

• 定位到自定义css
• 添加代码
• 设置文章标题级别

最后需要预览或发布后，才能看到。

好啦，去看看效果吧！