How can I show code (specifically C++) in an HTML page?

前端 未结 3 1983
独厮守ぢ
独厮守ぢ 2021-02-05 14:51

How can I show code in a website using HTML? Basically, I have a C++ program that I\'d like to share on my website and I want to show it in the page.

Is there anyway to

相关标签:
3条回答
  • 2021-02-05 15:39

    HTML includes a tag called <code>, which is meant for the purpose you describe.

    The spec even includes an example class name convention to indicate which language the code is in:

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

    I don’t know of any web browser that supports such a convention (come on, Chrome), but the JavaScript syntax highlighters mentioned in other answers could use it to work their magic.

    As you can see in the example, the <code> tag is usually wrapped in the <pre> tag, which preserves white space, which is often important for code.

    0 讨论(0)
  • 2021-02-05 15:49

    You can use SyntaxHighlighter. It will unobtrusively enhance code samples on your page with specific syntax highlighting for a wide range of languages.

    Here's an example for 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>
    
    0 讨论(0)
  • 2021-02-05 15:51

    There are various syntax highlighters out there. Google Code Prettify is a pretty good one. (Good enough for Stack Overflow to use, anyway.)

    0 讨论(0)
提交回复
热议问题