# highlight.js
{{tag>code highlight}}

- https://highlightjs.org/static/demo/


## 적용

도쿠위키에서 `<pre class="code"> ... </pre>` 로 렌더링 되어서, `('pre.code')` 로 설정하였다.

<code dart>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/atom-one-dark.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js"></script>
<script>
        hljs.highlightAll();

        document.querySelectorAll('pre.code').forEach(el => {
          hljs.highlightElement(el);
        });
</script>


<script src="//cdnjs.cloudflare.com/ajax/libs/highlightjs-line-numbers.js/2.8.0/highlightjs-line-numbers.min.js"></script>
<script>
        hljs.initLineNumbersOnLoad();

        document.querySelectorAll('pre.code').forEach(el => {
          hljs.lineNumbersBlock(el);
        });
</script>
</code>