美化后的效果如下,自带的颜色有点淡。更换后在浏览文章更为亮眼。萝卜白菜各有所爱,网络上已经有一大堆更改的。我没有使用前缀图片但是保留了代码需要图片的直接放入相对应的目录即可。只需要修改Style.css文件替换原来的即可。
0x01 效果演示如下
[mark_a]绿色[/mark_a]
[mark_b]红色[/mark_b]
[mark_c]灰色[/mark_c]
[mark_d]黄色[/mark_d]
[mark_e]蓝色[/mark_e]
0x02 修改替换代码
编辑/wp-content/themes/begin/style.css文件,查找「mark_ 」一共5个分别是「 mark_a、mark_b、mark_c、mark_d、mark_e」,按照下面的代码进行替换或修改即可。保留了图片的连接地址,没有图片也不影响使用,如需要图片需要将图片放到主题的img目录。
.mark_a { /* background: #ecf2d6; */ # 主题自带,可以删除; color: #7da33c; background: #ecf2d6 url('img/mark_a.png') -1px -1px no-repeat; border: 1px solid #aac66d; overflow: hidden; margin: 10px 0; padding: 3px 3px 3px 10px; } .mark_b { /* background: #ffecea; */ # 主题自带,可以删除; color: #c66; background: #ffecea url('img/mark_b.png') -1px -1px no-repeat; border: 1px solid #ebb1b1; overflow: hidden; margin: 10px 0; padding: 3px 3px 3px 10px; } .mark_c { /* background: #f1f1f1; */ # 主题自带,可以删除; color: #777; background: #eaeaea url('img/mark_c.png') -1px -1px no-repeat; border: 1px solid #ccc; overflow: hidden; margin: 10px 0; padding: 3px 3px 3px 10px; } .mark_d { /* background: #fff4b9; */ # 主题自带,可以删除; color: #ad9948; background: #fff4b9 url('img/mark_d.png') -1px -1px no-repeat; border: 1px solid #eac946; overflow: hidden; margin: 10px 0; padding: 3px 3px 3px 10px; } .mark_e { /* background: #c4e7f7; */ # 主题自带,可以删除; color: #1ba1e2; background: #1ba1e242 url('img/mark_e.png') -1px -1px no-repeat; border: 1px solid #1ba1e2; overflow: hidden; margin: 10px 0; padding: 3px 3px 3px 10px; }
图标下载
百度网盘 提取码: kn6j