如何在Google Prettify的所有行中添加行号？
我正在使用美化：
<pre class="prettyprint linenums"> some code </pre> 它的作品，但行号显示每5行，而不是每一行。 我正在使用这些文件
<link href="../src/prettify.css" type="text/css" rel="stylesheet" /> <script type="text/javascript" src="../src/prettify.js"></script>
基本上在这个页面的结尾http://google-code-prettify.googlecode.com/svn/trunk/styles/index.html你可以看到我想要的，但我看了看代码，我无法想象它出。
根本原因是list-style-type: none在prettify.css中：
/* Specify class=linenums on a pre to get line numbering */ ol.linenums { margin-top: 0; margin-bottom: 0 } /* 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 /* <<< THIS is the cause! */ } /* Alternate shading for lines */ li.L1, li.L3, li.L5, li.L7, li.L9 { background: #eee }
您可以删除该规则或使用以下规则覆盖该规则：
.linenums li { list-style-type: decimal; }
解
而不是修改CSS，您可以简单地添加一行CSS来实现所需的行为：
<style> .prettyprint ol.linenums > li { list-style-type: decimal; } </style>
例
一个完整的例子可能有下面的代码。 通过jsfiddle查看结果或看下面
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/prettify/r298/prettify.min.css" /> <style> .prettyprint ol.linenums > li { list-style-type: decimal; } </style> <pre class="prettyprint linenums"> foo bar bis sed awk cat </pre> <script src="//cdnjs.cloudflare.com/ajax/libs/prettify/r298/prettify.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/prettify/r298/run_prettify.js"></script>
我喜欢有交替的背景颜色，所以这样做：
/* White background color for all even-numbered lines */ li.L0, li.L2, li.L4, li.L6, li.L8 { background-color: #fff; } /* Light-gray background color for all odd-numbered lines */ li.L1, li.L3, li.L5, li.L7, li.L9 { background-color: #eee; }
;){kind=link}