markdown 사용법


편집기의 경우


MarkdownPad 2를 사용한다.


code 블럭을 변경하기 위해선


/* CODE
=============================================================================*/

precodett {
  font-size: 12px;
  font-family: Consolas, "Liberation Mono", Courier, monospace;
  
}

codett {
  margin: 0px 0px;
  padding: 1px 5px;
  white-space: nowrap;
  border: 1px solid #eaeaea;
  background-color: #f8f8f8;
  border-radius: 3px;
  color: #c90000;    
}


의 코드를 수정 한다.

css 문법이며


이곳에서 code, tt에서 padding을 변경하면 순서대로 수직, 수평의 padding 값을 나타낸다.

[Highlight.js] Tistory 소스코드 하이라이트


Highlight.js 소개


홈페이지: click

라이브 데모: click



설치방법


1) 홈페이지가서 다운로드 받음

2) 파일업로드

highlight.pack.js

styles/"원하는 하이라이트 파일"

ex: monokai_sublime.css

아래의 데모에서 각각의 스타일의 표시 방식을 볼 수 있다.

라이브 데모: click


3) CSS/HTML 수정

<head> ... </head>

저 사이에 아래의 코드를 삽입 해야한다.

<link rel="stylesheet" href="//cdn.jsdelivr.net/highlight.js/8.7/styles/monokai_sublime.min.css">
<script src="//cdn.jsdelivr.net/highlight.js/8.7/highlight.min.js"></script>
<script>hljs.initHighlightingOnLoad();</script>

<script src="//cdn.jsdelivr.net/highlight.js/8.7/highlight.min.js"></script>

위코드에서 빨간색 부분이 스타일을 나타낸다.



사용방법


Html 편집 모드에서 아래의 코드를 앞뒤로 삽입 하면 된다.

<pre><code class="html">...</code></pre>


참고사이트



http://webdir.tistory.com/439



'일상 > 정보 수집' 카테고리의 다른 글

markdown 사용법  (0) 2016.03.25
[SyntaxHighlighter] Tistory 소스코드 하이라이트  (0) 2015.06.29
원격  (0) 2013.11.20
소스코드 하이라이트  (0) 2013.06.04
원격 데스크탑 설정 가이드 라인  (0) 2013.01.11

각종 옵션들



  1. <pre class="brush:html"> <!-- HTML 소스표시 -->
  2. <pre class="brush:css"> <!-- CSS 소스표시 -->
  3. <pre class="brush:js"> <!-- JavaScript 소스표시 -->
  4. <pre class="brush:html highlight:[2,4]"> <!-- 특정 행 강조 -->
  5. <pre class="brush:js html-script:true"> <!-- 다른 언어와 HTML -->
  6. <pre class="brush:html first-line:25"> <!-- 시작 행 번호 변경 -->
  7. <pre class="brush:html toolbar:false"> <!-- 도구모음 숨기기 -->
  8. <pre class="brush:html auto-links:false"> <!-- 오토 링크 해제 -->
  9. <pre class="brush:html" title="Blomari Note"> <!-- 제목 표시 -->


테마 변경



  1. <link rel="stylesheet" type="text/css" href="./images/shCoreDefault.css" />

테마 레퍼런스 사이트


shCore 와 shTeme의 차이점

shCore가 주변 테두리 없이 변경되어서 좋음.



언어 종류



  1. SyntaxHighlighter.autoloader(
  2. 'applescript ./images/shBrushAppleScript.js',
  3. 'actionscript3 as3 ./images/shBrushAS3.js',
  4. 'bash shell ./images/shBrushBash.js',
  5. 'coldfusion cf ./images/shBrushColdFusion.js',
  6. 'cpp c ./images/shBrushCpp.js',
  7. 'c# c-sharp csharp ./images/shBrushCSharp.js',
  8. 'css ./images/shBrushCss.js',
  9. 'delphi pascal ./images/shBrushDelphi.js',
  10. 'diff patch pas ./images/shBrushDiff.js',
  11. 'erl erlang ./images/shBrushErlang.js',
  12. 'groovy ./images/shBrushGroovy.js',
  13. 'java ./images/shBrushJava.js',
  14. 'jfx javafx ./images/shBrushJavaFX.js',
  15. 'js jscript javascript ./images/shBrushJScript.js',
  16. 'perl pl ./images/shBrushPerl.js',
  17. 'php ./images/shBrushPhp.js',
  18. 'text plain ./images/shBrushPlain.js',
  19. 'py python ./images/shBrushPython.js',
  20. 'ruby rails ror rb ./images/shBrushRuby.js',
  21. 'sass scss ./images/shBrushSass.js',
  22. 'scala ./images/shBrushScala.js',
  23. 'sql ./images/shBrushSql.js',
  24. 'vb vbnet ./images/shBrushVb.js',
  25. 'xml xhtml xslt html ./images/shBrushXml.js'
  26. );


사용방법


<pre class="brush: 언어이름;">

/* 코드 */

</pre>



<script type="syntaxhighlighter" class ="brush: 언어이름">

/* */

</script>




참고 사이트


http://alexgorbatchev.com/SyntaxHighlighter/manual/demo/

http://blomari.tistory.com/54



'일상 > 정보 수집' 카테고리의 다른 글

markdown 사용법  (0) 2016.03.25
[Highlight.js] Tistory 소스코드 하이라이트  (0) 2015.09.30
원격  (0) 2013.11.20
소스코드 하이라이트  (0) 2013.06.04
원격 데스크탑 설정 가이드 라인  (0) 2013.01.11


실행창에서


Sysdm.cpl


http://pygments.org/demo/

'일상 > 정보 수집' 카테고리의 다른 글

markdown 사용법  (0) 2016.03.25
[Highlight.js] Tistory 소스코드 하이라이트  (0) 2015.09.30
[SyntaxHighlighter] Tistory 소스코드 하이라이트  (0) 2015.06.29
원격  (0) 2013.11.20
원격 데스크탑 설정 가이드 라인  (0) 2013.01.11

http://iptime.co.kr/bbs/view.php?id=faq_setup&no=525 


공유기 설정은 위의 것을 참조 한다.




'일상 > 정보 수집' 카테고리의 다른 글

markdown 사용법  (0) 2016.03.25
[Highlight.js] Tistory 소스코드 하이라이트  (0) 2015.09.30
[SyntaxHighlighter] Tistory 소스코드 하이라이트  (0) 2015.06.29
원격  (0) 2013.11.20
소스코드 하이라이트  (0) 2013.06.04

+ Recent posts