WordPress中使用CSS高亮HTML的code标签

Markdown中的Code标签

在Markdown中,用一对`来表示html中的code标签。例如`this is a code`会被翻译成<code>this is a code</code>。而通过查看WordPress中的很多主题,发现很多主题把code标签取消了高亮显示。

解决

WordPress对应的版本是4.1,其他版本操作可能有出入,进入后台后:外观 > 编辑,然后在新出现的编辑窗口加入如下代码并保存,位置不限。设置好后,就会拥有和本站一样的代码高亮效果。需要注意的是,若以后对主题进行升级,还需要再次重复这些操作。

/*样式只对`class=entry-content`的`code`标签有效,即正文部分*/
.entry-content code {
border:1px solid #EAEAEA;
background-color:#F8F8F8;
padding:2px;
margin:2px;
/* 圆角效果 */
border-radius:4px;
/* 不自动换行 */
white-space:nowrap;
}

发表评论

电子邮件地址不会被公开。 必填项已用*标注