15

如何使用 HTML 在网站中显示代码?基本上,我有一个想在我的网站上分享的 C++ 程序,并且我想在页面中展示它。

除了使用 HTML 文本之外,还有其他方法可以在 HTML 中显示 C++ 代码吗?

4

3 回答 3

12

HTML 包含一个名为 的标记<code>,用于您描述的目的。

该规范甚至包括一个示例类名称约定,以指示代码使用的语言:

<pre><code class="language-pascal">var i: Integer;
    begin
        i := 1;
    end.</code></pre>

我不知道有任何网络浏览器支持这种约定(来吧,Chrome),但其他答案中提到的 JavaScript 语法荧光笔可以使用它来发挥他们的魔力。

正如您在示例中看到的那样,<code>标签通常被包裹在<pre>标签中,它保留了空白,这对于代码来说通常很重要。

于 2011-04-19T00:22:05.597 回答
9

您可以使用SyntaxHighlighter。它将不显眼地增强页面上的代码示例,并为各种语言提供特定的语法突出显示。

这是 C++ 的示例

<head>
  <link href="css/shCore.css" rel="stylesheet" type="text/css" />
  <link href="css/shThemeDefault.css" rel="stylesheet" type="text/css" />
</head>

<body>
  <pre class='brush: cpp'>
  // my first program in C++
  #include <iostream>
  using namespace std;

  int main ()
  {
    cout << "Hello World!";
    return 0;
  }
  </pre>

  <script src="js/shCore.js"></script>
  <script src="js/shBrushCpp.js"></script>
  <script>
    SyntaxHighlighter.all()
  </script>
</body>
于 2011-04-19T00:15:53.157 回答
9

那里有各种语法荧光笔。 Google Code Prettify是一个相当不错的。(无论如何,对于 Stack Overflow 来说已经足够了。)

于 2011-04-19T00:16:48.817 回答