Question

I am trying to display the following in a reveal.js slide

<section>
                        <pre><code>
<html>
<head>
  <meta charset="utf-8">
  <title>My HTML 5 Page</title>
  <script src="modernizr.min.js"></script>
</head>
<body>
  ...
</body>
</html>
                        </code></pre>
</section>

However the <html>, <head>, <body> tags are not displayed in the presentation. I have highlight.js loading, it just seems to ignore certain elements. Any idea of what could be wrong?

Thanks!

Was it helpful?

Solution

Escape the HTML tags with &lt; and &gt;

&lt;section&gt;
&lt;pre&gt;&lt;code&gt;
&lt;html&gt;
    &lt;head&gt;
        &lt;meta charset="utf-8"&gt;
        &lt;title&gt;My HTML 5 Page&lt;/title&gt;
        &lt;script src="modernizr.min.js"&gt;&lt;/script&gt;
    &lt;/head&gt;
    &lt;body&gt;
        ...
    &lt;/body&gt;
&lt;/html&gt;
&lt;/code&gt;&lt;/pre&gt;
&lt;/section&gt;
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top