杨小杰博客提供免费教程下载和网站搭建技术教程,主要分享和发布网站源码,致力创造一个高质量网络资源教程的分享平台

emlog中pre标签美化

Young小杰2017-4-24 19:01网站搭建(4)1649查询中……小标签: emlog 原创

以前一直使用的是代码高亮的插件,但是代码高亮插件用着始终觉得不是很好看,所以就扒了宝塔论坛的pre样式

样式替换教程:

1、找到emlog模版使用的css样式,一般的都是style.css这个文件

2、找到一行插入代码:

pre{box-sizing:border-box; 
/*以下样式是自动换行代码*/	
white-space: pre-wrap; /* css-3 */ 
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */ 
white-space: -pre-wrap; /* Opera 4-6 */ 
white-space: -o-pre-wrap; /* Opera 7 */ 
word-wrap: break-word; /* Internet Explorer 5.5+ */ 
/*以上样式是自动换行代码,需要的加上,不需要的删除*/
overflow:auto;
font-family:Menlo, Monaco, Consolas, 'Courier New', monospace;
font-size:13px;
padding:9.5px;
margin-top:0px;
margin-bottom:10px;
line-height:1.42857;
color:#333333;
word-break:break-all;
word-wrap:break-word;
border:1px solid #CCCCCC;
border-radius:4px;
background-color:#F5F5F5;}
保存即可,使用方法,在写文章的时候在需要这个样式时在前后插入一对<pre></pre>即可
本文最后更新于2017-4-24,已超过 1 年没有更新,如果文章内容或图片资源失效,请留言反馈,我们会及时处理,谢谢!

评论:

古韵 Google Chrome 37.0.0.0 Linux广西贵港市 联通 2017-05-14 09:32
你的全部样式都变了,是你手动改的?
Young小杰局域网 对方和您在同一内部网 2017-05-14 09:36
@古韵:在style.css中加一个pre的样式即可,只要有pre标签都会引用
李明 Opera 43.0.2442.1144 非主流操作系统广东省佛山市 360网站卫士电信CDN节点 2017-04-24 20:38
很好看...
Young小杰广东省佛山市 360网站卫士电信CDN节点 2017-04-24 20:42
@李明:谢谢

发表评论: