<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8" /> <link rel="icon" href="favicon.png" /> <title>Keep markup ▲ Prism plugins</title> <base href="../.." /> <link rel="stylesheet" href="style.css" /> <link rel="stylesheet" href="themes/prism.css" data-noprefix /> <style type="text/css"> code[class*="language-"] mark, pre[class*="language-"] mark { display: inline-block; color: inherit; background: none; border: 1px solid #000; box-shadow: 0 0 2px #fff; padding: 1px; background: rgba(0,0,0,0.2); } </style> <script src="prefixfree.min.js"></script> <script>var _gaq = [['_setAccount', 'UA-33746269-1'], ['_trackPageview']];</script> <script src="https://www.google-analytics.com/ga.js" async></script> </head> <body> <header> <div class="intro" data-src="templates/header-plugins.html" data-type="text/html"></div> <h2>Keep markup</h2> <p>Prevents custom markup from being dropped out during highlighting.</p> </header> <section> <h1>How to use</h1> <p>You have nothing to do. With this plugin loaded, all markup inside code will be kept.</p> <h1>Examples</h1> <p>The following source code</p> <pre><code class="language-markup"><pre><code class="language-css"> @media <mark>screen</mark> { div { <mark>text</mark>-decoration: <mark><mark>under</mark>line</mark>; back<mark>ground: url</mark>('foo.png'); } }</code></pre></code></pre> <p>would render like this:</p> <pre><code class="language-css"> @media <mark>screen</mark> { div { <mark>text</mark>-decoration: <mark><mark>under</mark>line</mark>; back<mark>ground: url</mark>('foo.png'); } }</code></pre> <p> It also works for inline code: <code class="language-javascript">v<mark>ar b</mark>ar = <mark>func</mark>tion () { <mark>/*</mark> foo <mark>*</mark>/ };</code> </p> </section> <footer data-src="templates/footer.html" data-type="text/html"></footer> <script src="prism.js"></script> <script src="plugins/keep-markup/prism-keep-markup.js"></script> <script src="utopia.js"></script> <script src="components.js"></script> <script src="code.js"></script> </body> </html>