마크다운
마크다운이란 웹상에서 글을 쓸 수 있는 도구 중 하나입니다.
문법이 쉽고, 관리가 쉽다는 장점이 있습니다. 또한 지원 가능한 플랫폼과 프로그램이 다양하게 존재합니다.
마크다운 작성법
1. 제목
제목은 HTML의 H1 ~ H6 처럼 사용을 할 수 있습니다.
# 제목 (H1)
## 제목 (H2)
### 제목 (H3)
#### 제목 (H4)
##### 제목 (H5)
###### 제목 (H6)출력화면 ⬇
제목 (H1)
제목 (H2)
제목 (H3)
제목 (H4)
제목 (H5)
제목 (H6)
2. 문장과 줄바꿈
문장은 HTML의 <p>태그와 마찬가지로 조건 없이 적을 수 있습니다.
하지만 여기서 엔터를 눌러도 줄바꿈이 되지 않을 수 있는데, 그때는 줄바꿈을 하고 싶은 위치에 띄어쓰기를 2번 하거나, HTML처럼 <br/>태그를 사용하면 줄바꿈을 할 수 있습니다.
동해물과 백두산이 마르고 닳도록
하느님이 보우하사 우리나라 만세
무궁화 삼천리 화려 강산<br>
대한 사람 대한으로 길이 보전하세출력화면 ⬇
동해물과 백두산이 마르고 닳도록
하느님이 보우하사 우리나라 만세
무궁화 삼천리 화려 강산
대한 사람 대한으로 길이 보전하세
3. 강조
강조에는 총 4가지 방식이 있습니다.
이 강조 방법은 서로 혼합을 하여 사용할 수도 있습니다.
_이텔릭_
**두껍게**
~~취소선~~
<u>밑줄</u>출력화면 ⬇
이텔릭
두껍게
취소선
밑줄
4. 목록
목록에는 순서가 필요한 목록과 순서가 필요하지 않은 목록으로 나눠서 작성할 수 있습니다.
먼저 순서가 필요한 목록은 숫자 1. 을 사용하여 작성을 해주면 됩니다.
여기서 하위 뎁스를 표현하고 싶으면, 표현하고 싶은 부분 앞에 띄어쓰기 4번(들여쓰기 2번)을 해주시면 됩니다.
1. 순서가 필요한 목록
1. 순서가 필요한 목록
1. 순서가 필요한 목록
1. 순서가 필요한 목록
1. 순서가 필요한 목록
1. 순서가 필요한 목록출력화면 ⬇
- 순서가 필요한 목록
- 순서가 필요한 목록
- 순서가 필요한 목록
- 순서가 필요한 목록
- 순서가 필요한 목록
- 순서가 필요한 목록
그리고 순서가 필요하지 않은 목록은 -를 사용하여 작성해주면 됩니다.
하위 뎁스를 표현하고 싶다면, 위에 내용과 마찬가지로 띄어쓰기 4번(들여쓰기 2번)을 해주시면 됩니다.
- 순서가 필요하지 않은 목록
- 순서가 필요하지 않은 목록
- 순서가 필요하지 않은 목록
- 순서가 필요하지 않은 목록
- 순서가 필요하지 않은 목록
- 순서가 필요하지 않은 목록
- 순서가 필요하지 않은 목록출력화면 ⬇
- 순서가 필요하지 않은 목록
- 순서가 필요하지 않은 목록
- 순서가 필요하지 않은 목록
- 순서가 필요하지 않은 목록
- 순서가 필요하지 않은 목록
- 순서가 필요하지 않은 목록
- 순서가 필요하지 않은 목록
5. 링크
링크는 HTML에서 사용하는 것 처럼 <a>로 사용할 수 있는 방법과 [ ]( )를 사용할 수 있는 방법 2가지가 있습니다.
그리고 title과 같은 태그의 옵션도 사용할 수 있습니다.
*target은 제외. <a>에서만 사용 가능합니다.
<a href="https://google.com">GOOGLE</a>
[GOOGLE](https://google.com)
<a href="https://naver.com" title="네이버로 이동!" target="_blank">GOOGLE</a>
[NAVER](https://naver.com "네이버로 이동!")[ ]( ) 이 방법은 [ ]안에 링크를 걸어줄 텍스트를 넣어주고, ( )안에 연결되는 링크를 적어주면 됩니다.
출력화면 ⬇
6. 이미지
이미지는 를 사용하여 출력할 수 있습니다.
그리고 이미지에 링크를 걸고 싶다면 위에 링크에서 사용한 방식으로 이미지를 감싸주면 됩니다.
[](연결될 링크)7. 인용문
인용문은 남의 말이나 글에서 직접 또는 간접으로 따온 문장으로 >를 사용하여 출력할 수 있습니다.
>출력화면 자체가 인용문 입니다.출력화면 ⬇
출력화면 자체가 인용문 입니다.
그리고 인용문은 서로 중첩이 가능합니다.
> 중중첩된 인용문 1
>> 중중첩된 인용문 2
>>> 중중첩된 인용문 3출력화면 ⬇
중중첩된 인용문 1
중중첩된 인용문 2
중중첩된 인용문 3
8. 인라인 코드 강조, 블록 코드 강조
먼저 인라인 코드 강조 방법은 단어를 코드로 표현하고 싶을 때 사용할 수 있습니다.
사용법으론 ``(backtick)안에 출력할 내용을 넣어주면 됩니다.
`margin`출력화면 ⬇
margin
블록 코드 강조 방법은 인라인 코드 강조 방법에서 사용한 ```(backtick)을 3번 연속으로 찍어주고 HTML, CSS 등을 써주면 됩니다. 텍스트만 블록 코드 강조 방법으로 출력하고 싶다면 plaintext를 사용해주면 됩니다.
출력화면 ⬇
<a href="https://google.com" target="_blank">GOOGLE</a>li{ positon:absolute; margin-left:40px; }텍스트만 블록 코드 강조 방법으로 출력하고 싶을 때 이렇게 출력합니다.
9. 표
표는 바로 예시를 보여드리겠습니다.
값 | 의미 | 기본값
--|:--:|:--:
static | 기준 없음 | O
relative | 요소 자신 | X
absolute | 위치 상 부모 요소 | X
fixed | 뷰포트 | X출력화면 ⬇
값 의미 기본값 static 기준 없음 O relative 요소 자신 X absolute 위치 상 부모 요소 X fixed 뷰포트 X
제일 위에 값은 | 를 사용하여 표의 분류를 나눠주고
그 안에 열의 개수만큼 --|--|-- 영역을 표시해주면서 | 를 사용해 행의 값들을 입력합니다.
*열의 개수를 나눠줄 때 : 을 사용하면 정렬방향을 정할 수 있습니다.
:-- 왼쪽 정렬
:--: 가운데 정렬
--: 오른쪽 정렬
10. 원시 HTML
HTML에서 사용했던 코드들과 HTML코드 안에 style 코드를 넣어서 출력하는 방식이 사용 가능합니다.
동해물과 <span style="text-decoration: underline;">백두산</span>이 마르고 닳도록<br>
하느님이 보우하사 우리나라 만세출력화면 ⬇
동해물과 백두산이 마르고 닳도록
하느님이 보우하사 우리나라 만세
11. 수평선
수평선을 출력할 수 있는 방법은 총 3가지가 있습니다.
---
***
___출력화면 ⬇
