代码介绍如果你觉得网站的H行标签总是很难看,不够突出。可以试试我分享的这个H行标签美化代码,依然是上古美化,但依然不那么落伍
H2代码效果
H3代码效果
H4代码效果
H5代码效果
请注意:如果你对行标签使用了隐藏代码等短代码隐藏功能,或导致行标签样式失效。
请注意:如果你的主题不是B2主题,需要修改样式中的.entry-content这个样式名。查看方法就是自己发表带有H行标签的文章,然后查看行标签的上级(文章内容标签)标签样式名是什么,然后修改下方的.entry-content样式名。
实在不会的可以评论区留下你的网站,我帮你看一下。
请注意:如果你的主题不是B2主题,需要修改样式中的.entry-content这个样式名。查看方法就是自己发表带有H行标签的文章,然后查看行标签的上级(文章内容标签)标签样式名是什么,然后修改下方的.entry-content样式名。
实在不会的可以评论区留下你的网站,我帮你看一下。
相关样式代码,放到你的style.css文件内即可
/**************************************** H标签样式 ********************************************/ .entry-content>h2,.entry-content>h3,.entry-content>h4,.entry-content>h5 { font-weight: bold; background-color: #f6f6f6; margin: 20px 0; border-bottom: 0px solid red; padding: 5px 12px; border-left: 5px solid red; margin: 12px 0px; border-top-left-radius: 10px; border-bottom-left-radius: 10px; } .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; 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; } .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; } .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; }
内容声明:
- 1、本站分享的资源均经过人工审核、电脑实际使用/部署、病毒软件查杀无问题后上传。
- 2、站内资源使用以下查毒检测工具检测:火绒、微步、卡巴斯基、D盾、webshell等。
- 3、本站资源无任何杂七杂八的捆绑,即下即用,省心无套路。
- 4、任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。
- 5、如若本站内容侵犯了原著者的合法权益,可联系我们进行删除处理。邮箱:bber-cn@qq.com