Make a little progress every day
直接上代码
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<!-- 新 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">
<!-- 可选的Bootstrap主题文件（一般不用引入） -->
<!--<link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">-->
<!-- 默认样式 -->
<!--<link href="//cdn.bootcss.com/prettify/r298/prettify.min.css" rel="stylesheet">-->
<!-- 从百度ueditor引用的样式 -->
<link href="http://fex.baidu.com/ueditor/plugins/prettify/prettify.css" rel="stylesheet">
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="//cdn.bootcss.com/jquery/1.11.3/jquery.min.js"></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="//cdn.bootcss.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<script src="//cdn.bootcss.com/prettify/r298/prettify.min.js"></script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>质量录入</title>
</head>
<body onload="prettyPrint()">
<form action="" method="post">
<div class="container">
<h1 class="page-header">代码<small>google prettify代码高亮</small></h1>
<p>Bootstrap是基于<code>HTML5</code>和<code>CSS3</code>开发的，它在jQuery的基础上进行了更为个性化和人性化的完善，形成一套自己独有的网站风格，并兼容大部分jQuery插件。</p>
<pre class="prettyprint" style="font-family: 'Courier New', Courier, monospace; line-height: 15px;">
<!--linenums-->
//默认值：
[{
label: '', //显示的名称
cmdName: 'selectall', //执行的command命令，当点击这个右键菜单时
exec: function() { //exec可选，有了exec就会在点击时执行这个function，优先级高于cmdName
//this是当前编辑器的实例
//this.ui._dialogs['inserttableDialog'].open();
}
}]
</pre>
</div>
</form>
</body>
</html>默认代码高亮样试
.pln{color:#000}@media screen{.str{color:#080}.kwd{color:#008}.com{color:#800}.typ{color:#606}.lit{color:#066}.pun,.opn,.clo{color:#660}.tag{color:#008}.atn{color:#606}.atv{color:#080}.dec,.var{color:#606}.fun{color:red}}@media print,projection{.str{color:#060}.kwd{color:#006;font-weight:700}.com{color:#600;font-style:italic}.typ{color:#404;font-weight:700}.lit{color:#044}.pun,.opn,.clo{color:#440}.tag{color:#006;font-weight:700}.atn{color:#404}.atv{color:#060}}pre.prettyprint{padding:2px;border:1px solid #888}ol.linenums{margin-top:0;margin-bottom:0}li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8{list-style-type:none}li.L1,li.L3,li.L5,li.L7,li.L9{background:#eee}百度ueditor代码高亮样式
/* desert scheme ported from vim to google prettify /
pre.prettyprint { display: block; background-color: #333 }
pre .nocode { background-color: none; color: #000 }
pre .str { color: #ffa0a0 } / string - pink /
pre .kwd { color: #f0e68c; font-weight: bold }
pre .com { color: #87ceeb } / comment - skyblue /
pre .typ { color: #98fb98 } / type - lightgreen /
pre .lit { color: #cd5c5c } / literal - darkred /
pre .pun { color: #fff } / punctuation /
pre .pln { color: #fff } / plaintext /
pre .tag { color: #f0e68c; font-weight: bold } / html/xml tag - lightyellow /
pre .atn { color: #bdb76b; font-weight: bold } / attribute name - khaki /
pre .atv { color: #ffa0a0 } / attribute value - pink /
pre .dec { color: #98fb98 } / decimal - lightgreen /
/* Specify class=linenums on a pre to get line numbering /
ol.linenums { margin-top: 0; margin-bottom: 0; color: #AEAEAE } / IE indents via margin-left /
li.L0,li.L1,li.L2,li.L3,li.L5,li.L6,li.L7,li.L8 { list-style-type: none }
/* Alternate shading for lines /
li.L1,li.L3,li.L5,li.L7,li.L9 { }
@media print {
pre.prettyprint { background-color: none }
pre .str, code .str { color: #060 }
pre .kwd, code .kwd { color: #006; font-weight: bold }
pre .com, code .com { color: #600; font-style: italic }
pre .typ, code .typ { color: #404; font-weight: bold }
pre .lit, code .lit { color: #044 }
pre .pun, code .pun { color: #440 }
pre .pln, code .pln { color: #000 }
pre .tag, code .tag { color: #006; font-weight: bold }
pre .atn, code .atn { color: #404 }
pre .atv, code .atv { color: #060 }
}