- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
相关How to add line numbers to all lines in Google Prettify?
我正在查看谷歌的 http://code.google.com/p/google-code-prettify/在网页中显示我用 Mathematica 编写的代码。
Mathematica 不是受支持的语言。所以,甚至认为我可以做到以下几点
<pre class="prettyprint linenums">
Manipulate[
tick;
Module[{a1, a2, a3, v1, v2, v3, h1, a1d, a2d, a3d, z},
]
</pre>
这在显示行号方面有效,但使用的语法突出显示已关闭并且不适合我使用的语言,因为我理解当然不支持它。
我很乐意只列出代码,使用 nocode
类,没有突出显示,但我也希望能够获得行号。所以,我尝试了这个:
<pre class="prettyprint linenums">
<span class="nocode"> <!-- also tried <span class="nocode linenums"--->
Manipulate[
tick;
Module[{a1, a2, a3, v1, v2, v3, h1, a1d, a2d, a3d, z},
</span>
</pre>
但是行号不显示在 nocode
类中。
有没有办法修改 prettify.js
并让它也显示 nocode 的行号?我将主要使用它来列出代码,但需要查看行号。
这是一个完整的MWE
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8"/>
<script src="https://google-code-prettify.googlecode.com/svn/loader/run_prettify.js"></script>
</head>
<body onload="prettyPrint()">
<pre class="prettyprint linenums">
<span class="nocode linenums">
Manipulate[
tick;
Module[{a1, a2, a3, v1, v2, v3, h1, a1d, a2d, a3d, z},
Which[state == "init" || state2 == "on",
state2 = "off";
If[state == "init", state = "paused"];
state == "running" || state == "step",
If[currentTime > maxTime, currentTime = 0]
];
]
</span>
</pre>
</body>
</html>
更新
感谢 Gaby,它现在可以正常工作了。这是最终结果
最佳答案
将 nocode
类放在 pre
元素上..
<pre class="prettyprint linenums nocode">
演示在 http://jsfiddle.net/gaby/8Jwja/1/
更新
要显示所有数字(并在数字后不带点显示),您必须重写 CSS
添加
ol.linenums{
counter-reset:linenumber;
}
ol.linenums li{
list-style-type:none;
counter-increment:linenumber;
}
ol.linenums li:before{
content: counter(linenumber);
float:left;
margin-left:-4em;
text-align:right;
width:3em;
}
关于javascript - 在 nocode 类中使用 google prettify 时如何添加行号?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20832027/
相关How to add line numbers to all lines in Google Prettify? 我正在查看谷歌的 http://code.google.com/p/google-
我是一名优秀的程序员,十分优秀!