本文记录针对wordpress文章的css样式美化代码，感谢jokeworld提供。
该代码可以在wordpress后台--外观--自定义--额外的css中添加，也可以在直接写入主题style.css，或者替换原h标签样式。
代码样式
.post .entry-content h1{
font-size:25px;
font-weight:bold;
color: #e50d4c;
background-color: #fccad3;
border-bottom: 1px solid;
padding: 5px 15px;
border-left: 5px solid;
margin:18px 0px 18px 0px;
overflow: hidden;
}
.post .entry-content h2{
font-size:21px;
font-weight:bold;
color: #850de8;
background-color: #eeeafe;
border-bottom: 1px solid;
padding: 5px 15px;
border-left: 5px solid;
margin:18px 0px 18px 0px;
overflow: hidden;
}
.post .entry-content h3{
font-size:17px;
font-weight:bold;
color: #41b0f4;
background-color: #ddf0fe;
border-bottom: 1px solid;
padding: 5px 15px;
border-left: 5px solid;
margin:18px 0px 18px 0px;
overflow: hidden;
}
.post .entry-content h4{
font-size:13px;
font-weight:bold;
color: #20b60b;
background-color: #ebfde5;
border-bottom: 1px solid;
padding: 5px 15px;
border-left: 5px solid;
margin:18px 0px 18px 5px;
overflow: hidden;
}
.post .entry-content h5{
font-size:10px;
font-weight:bold;
color: #f1e40f;
background-color: #fefeea;
border-bottom: 1px solid;
padding: 5px 15px;
border-left: 5px solid;
margin:18px 0px 18px 10px;
overflow: hidden;
}
代码注释
.entry-content h5{/*类选择器*/
font-size:10px;/*字体大小*/
font-weight:bold;/*字体加粗,值可以为数字也可以为bold(加粗)*/
color: #f1e40f;/*字体内容颜色*/
background-color: #fefeea;/*背景颜色*/
border-bottom: 1px solid;/*下边框样式:1px为宽度,solid边框样式(有很多样式具体自己查吧),后边还可以加上具体颜色*/
padding使用方法一样: 5px 15px;/*内边距属性:5px为上内边距和下内边距,15px为右内边距和左内边距也可以单独写,具体为:上右下左*/
border-left: 5px solid;/*左边框的样式:和上边的border-bottom使用方法一样*/
margin:18px 0px;/*外边距属性:和上边的padding使用方法一样*/
overflow: hidden;/*当内容显示的内容超出时怎么办:hidden(隐藏超出部分),还有其他的值,自己查一下*/
展示效果
本文地址：https://8ik.cn/archives/410
关注我们：请关注一下我们的微信公众号：扫描二维码
，公众号：Hey_MrBoss
温馨提示：文章内容系作者个人观点，不代表捌佰科对观点赞同或支持。
版权声明：本文为转载文章，来源于 jokeworld ，版权归原作者所有，欢迎分享本文，转载请保留出处！
关注我们：请关注一下我们的微信公众号：扫描二维码
，公众号：Hey_MrBoss温馨提示：文章内容系作者个人观点，不代表捌佰科对观点赞同或支持。
版权声明：本文为转载文章，来源于 jokeworld ，版权归原作者所有，欢迎分享本文，转载请保留出处！
