Visual tool중 markdown 설정

1. Markdown 

   Markdown은 web writers를 위한 text to HTML or XHTML 변환 도구를 제공함

   1) plain text formatting syntax

   2) software tool written in Perl

   Markdown 테스트 사이트 : http://daringfireball.net/project/markdown/dingus

   Markdown API 문서 : http://daringfireball.net/project/markdown/syntax

2. Markdown 사용예

1) Markdown 사용예제 1

= / -   :  header text style ( = : <h1>,    - : <h2> )

#        : heder text style ( # : <h1>,  ## : <h2>,  ### : <h3>, #### : <h4>, 

           ##### : <h5>, ###### : <h6> )

>       : blockqutes

A. Markdown text 문서

A First Level Header
====================

A Second Level Header
---------------------

Now is the time for all good men to come to
the aid of their country. This is just a
regular paragraph.

The quick brown fox jumped over the lazy
dog's back.

### Header 3

> This is a blockquote.
> 
> This is the second paragraph in the blockquote.
>
> ## This is an H2 in a blockquote

B. Markdown html 변환 문서

<h1>A First Level Header</h1>

<h2>A Second Level Header</h2>

<p>Now is the time for all good men to come to
the aid of their country. This is just a
regular paragraph.</p>

<p>The quick brown fox jumped over the lazy
dog's back.</p>

<h3>Header 3</h3>

<blockquote>
    <p>This is a blockquote.</p>

    <p>This is the second paragraph in the blockquote.</p>

    <h2>This is an H2 in a blockquote</h2>
</blockquote>

2) Markdown 사용예제2  (강조)

** / __  :  text emphasis  (텍스트 강조시)

A. Markdown text 문서

Some of these words *are emphasized*.
Some of these words _are emphasized also_.

Use two asterisks for **strong emphasis**.
Or, if you prefer, __use two underscores instead__.

B. Markdown html 변환 문서

<p>Some of these words <em>are emphasized</em>.
Some of these words <em>are emphasized also</em>.</p>

<p>Use two asterisks for <strong>strong emphasis</strong>.
Or, if you prefer, <strong>use two underscores instead</strong>.</p>

3) Markdown 사용예제3  (List)

List는 * / + / - 3가지 기호를 사용하여 표시

Ordered list는 숫자와 .으로 표시

A. Markdown text 문서

*   Candy.
*   Gum.
*   Booze.

+   Candy.
+   Gum.
+   Booze.

-   Candy.
-   Gum.
-   Booze.

1.  Red
2.  Green
3.  Blue

B. Markdown html 변환 문서

<ul>
<li>Candy.</li>
<li>Gum.</li>
<li>Booze.</li>
</ul>

<ol>
<li>Red</li>
<li>Green</li>
<li>Blue</li>
</ol>

4) Markdown 사용예제4 (Links)

inline : link하고자 하는 텍스트 뒤에 바로 url 연결 

          [text link](http://www.google.com)

reference : document 다른곳에 이름을 정의하고 텍스트에서 사용

 

A. inline 방식

This is an [example link](http://example.com/).

<p>This is an <a href="http://example.com/">
example link</a>.</p>

This is an [example link](http://example.com/ "With a Title").  ==> title 추가시

B. reference 방식

I get 10 times more traffic from [Google][1] than from
[Yahoo][2] or [MSN][3].

[1]: http://google.com/        "Google"
[2]: http://search.yahoo.com/  "Yahoo Search"
[3]: http://search.msn.com/    "MSN Search"

<p>I get 10 times more traffic from <a href="http://google.com/"
title="Google">Google</a> than from <a href="http://search.yahoo.com/"
title="Yahoo Search">Yahoo</a> or <a href="http://search.msn.com/"
title="MSN Search">MSN</a>.</p>

I start my morning with a cup of coffee and
[The New York Times][NY Times].

[ny times]: http://www.nytimes.com/

<p>I start my morning with a cup of coffee and
<a href="http://www.nytimes.com/">The New York Times</a>.</p>

5) Markdown 사용예제5 (images)

A. inline 방식

![alt text](/path/to/img.jpg "Title")

<img src="/path/to/img.jpg" alt="alt text" title="Title" />

B. reference 방식

![alt text][id]

[id]: /path/to/img.jpg "Title"

<img src="/path/to/img.jpg" alt="alt text" title="Title" />

6) Markdown 사용예제6 (code)

&와 <를 사용해서 표시하면 해당 코드가 그대로 html에 표시

I strongly recommend against using any `<blink>` tags.

I wish SmartyPants used named entities like `&mdash;`
instead of decimal-encoded entites like `&#8212;`.

<p>I strongly recommend against using any
<code>&lt;blink&gt;</code> tags.</p>

<p>I wish SmartyPants used named entities like
<code>&amp;mdash;</code> instead of decimal-encoded
entites like <code>&amp;#8212;</code>.</p>

reference :   http://daringfireball.net/projects/markdown