0

我想突出显示一些 css 代码,但我不想使用 pre 标记。我已经看到了许多基于 pre 标记的方法,但是我不想使用那个标记。还有哪些其他方法可以用来突出显示句法。

谢谢。

4

4 回答 4

2

你试过语法荧光笔吗?
它有很多功能可以帮助您进行语法高亮显示。

顺便说一句,你为什么不想使用<pre>标签?它是 HTML 中唯一保留空格等语法的标记。

语法荧光笔也可以与<script>标签一起使用,请参见此处

于 2012-06-02T08:26:29.000 回答
1

在头部添加 CDN

<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.1/styles/default.min.css">
<script src="http://cdnjs.cloudflare.com/ajax/libs/highlight.js/8.1/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

最后在页面中添加

<pre>
  <code class="C#"> 
    public ActionResult Index() {
        return View();
    }
 </code>
</pre>

这就是你不需要css下载,只要你的网站在互联网上。

于 2014-08-08T16:32:30.387 回答
1

pre元素与语法高亮无关。您在该元素内使用文本级标记,通常还使用 CSS 来突出显示。无论您在那里使用什么工具,也可以在div元素内部使用,例如,pblockquote

pre元素用于预格式化文本,因为它保留了空格和换行符。为了达到同样的效果,您可以white-space: pre在 CSS 中使用。作为副作用,pre还会导致使用等宽字体;为此,您还可以使用 CSS,例如font-family: Consolas, Courier New, monospace,或 HTML 标记,例如 ...。或者您可能认为没有令人信服的理由为 CSS 代码使用等宽字体。

于 2012-06-02T09:35:42.073 回答
0

您可以使用与 StackOverflow 相同的库:google-code-prettify

您可以将代码片段放在<code>...</code>标签而不是<pre>...</pre>标签中,使用起来非常简单。

于 2012-06-02T08:38:41.970 回答