highlight.js - 코드

highlight.js

코드를 여러가지 테마를 사용하여 예쁘게 꾸며줄수 있다.

 

사이트 바로가기

highlight.js

 

 

스타일 영역을 클릭하면 스타일이 바뀐다.

원하는 스타일을 찾았다면, 반영 소스에 넣어주면 된다. 

'atom-one-light'을 넣어보자,

 

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/스타일명.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

 

위 소스 중 맨위에 있는 css에 스타일명을 적어 준다.

<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/atom-one-light.min.css">

 

 

이외방법

'Get Version'을 들어가면 다른 방법으로도 반영하는 가이드와, 다운로드 해서 서버에 올료 사용하는 방법도 안내되어 있다.