티스토리 뷰
Explain
- 다양한 웹용 highlighter 라이브러리중 highlightjs 를 기본적으로 활용하는 방법 정리하여 포스팅.
- 현재 166개 언어와 77 스타일을 지원한다.
- highlightjs.org
Usage
- <head> 영역 내에 아래 내용을 추가해주면 아주 쉽고 빠르게 적용을 완료할 수 있다.
- 아래처럼 공개된 cdn 링크를 활용하여 바로 적용하는 방법이 있고 혹은 개인 서버 저장 공간에 위치시킨 뒤 해당 경로를 지정해주는 방식이 있다.
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.6.0/styles/default.min.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.6.0/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>Styling
- default.min.js 부분을 스타일이름.min.js 로수정하면 된다.
- 아래는 개인적으로 좋아하는 sublime style을 적용한 예시이다.
- style demo
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.6.0/styles/monokai-sublime.min.css">Other
'Tistory' 카테고리의 다른 글
| highlightjs Code 영역 폰트 변경하기 (0) | 2016.09.27 |
|---|---|
| MathJax를 활용하여 웹 페이지에 수학 수식 넣기 (0) | 2016.09.07 |
| 가비아 DNS 연결 (0) | 2016.09.07 |
댓글
공지사항
최근에 올라온 글
최근에 달린 댓글
- Total
- Today
- Yesterday
TAG
- 안드로이드
- Matrix
- syntax highlighting
- robocopy
- 삼항연산자
- 알고리즘
- 비트마스크
- Math
- Android
- 수식
- 행렬
- Highlighter
- mathjax
- algorithm
- C
- 도메인
- python
- 비트
- DNS
- highlightjs
- Kotlin
- 비트연산자
- mysql
- Bit
| 일 | 월 | 화 | 수 | 목 | 금 | 토 |
|---|---|---|---|---|---|---|
| 1 | ||||||
| 2 | 3 | 4 | 5 | 6 | 7 | 8 |
| 9 | 10 | 11 | 12 | 13 | 14 | 15 |
| 16 | 17 | 18 | 19 | 20 | 21 | 22 |
| 23 | 24 | 25 | 26 | 27 | 28 |
글 보관함