반응형
글을 작성할 때 html 대신 간단하게 사용할 수 있는 마크다운(Markdown) 언어를 대부분의 웹사이트에서 사용하고 있어 소개하려고 합니다.
마크다운(Markdown) 장점, 단점은?
- 문법이 쉽고 간결해서 대부분 개발자는 10분 만에 이해하고 사용할 수 있습니다.
- 마크다운(Markdown)은 관리하기 매우 편합니다.
- 대부분은 프로그램 및 플랫폼에서 지원하고 있습니다.
- 마크다운(Markdown) 표준이 없어 적용 가능 문법을 플랫폼, 프로그램마다 숙지하고 있어야 합니다.
- 간단한 기능은 지원되지만, 섬세한 기능은 태그를 사용해야 합니다.
마크다운(Markdown) 사용법
1. 마크다운(Markdown)에서 title 크기를 변경하는 방법.
- html 문법에서는 h1, h2, h3, h4, h5, h6로 사용합니다.
# aurumguide title1
## aurumguide title2
### aurumguide title3
#### aurumguide title4
##### aurumguide title5
###### aurumguide title6
실행 결과 :
2. 줄 바꿈(Line Breaks) 사용법.
줄 바꿈은 스페이스 3칸을 입력하거나 </br> 태그를 사용합니다.
실행 결과 :
3. 구분 선(Division Line) 사용법.
- 구분선은 '---' 표시합니다.
마크다운(Markdown) 구분 선 이전
---
마크다운(Markdown) 구분 선 이후
실행 결과 :
4. 들여 쓰기 사용법.
들여 쓰기 '>' 사용하세요.
마크다운(Markdown) 들여쓰기 적용 안 하면 버전.
> 마크다운(Markdown) 들여쓰기 버전1
> 마크다운(Markdown) 들여쓰기 버전2
실행 결과 :
5. 불릿(Bullet) 사용법.
- 대부분 '-' 사용하지만 '+', '*' 사용할 수 있습니다.
- 마크다운(Markdown) bullet
- 마크다운(Markdown) bullet
- 마크다운(Markdown) bullet
- 마크다운(Markdown) bullet
실행 결과 :
6. 숫자 사용법.
1. 마크다운(Markdown) Indexing1
2. 마크다운(Markdown) Indexing2
3. 마크다운(Markdown) Indexing3
4. 마크다운(Markdown) Indexing4
5. 마크다운(Markdown) Indexing5
실행 결과 :
7. 하이퍼 링크 설정하기.
- <링크 주소>
- [링크 이름](링크 주소)
- [링크 이름](링크 주소, "부연 설명")
- 부연 설명의 경우 마우스를 가져다 대면 보임
<https://aurumguide.tistory.com>
[아우럼 가이드 이동하기] (https://aurumguide.tistory.com/)
[아우럼 가이드 이동하기] (https://aurumguide.tistory.com/, "아우럼 가이드 이동합니다.")
실행 결과 :
8. 이미지 설정하기.
- ! [이미지 설명](이미지 주소)
![아우럼 가이드](https://img1.daumcdn.net/thumb/R1280x0/?scode=mtistory2&fname=https%3A%2F%2Fblog.kakaocdn.net%2Fdn%2FQjoEw%2FbtsIx1papag%2Fh9kWbiZkak1SB8ZGNSoubK%2Fimg.png)
실행 결과 :
9. 마크다운(Markdown) 글자 강조 사용법.
글자를 기울게 표시.
- 마크다운(Markdown)에서는 '*' 한 개를 사용하면 글자를 기울게 표시할 수 있습니다.
- <em> 태그도 사용할 수 있습니다.
*아무렴 가이드 기울게 글씨 보기*
<em> 아무럼 가이드 기울게 글씨 보기</em>
실행 결과 :
글자 강조 표시.
- 마크다운(Markdown)에서는 '**' 두 개를 사용하면 글자를 강조해서 표시할 수 있습니다.
- <strong> 태그도 사용할 수 있습니다.
**아무럼 가이드 강조 글씨 보기**
<strong> 아무럼 가이드 강조 글씨 보기</strong>
실행 결과 :
글자 기울게, 강조해서 표시.
- 마크다운(Markdown)에서는 '***' 세 개를 사용하면 글자를 기울게, 강조해서 표시할 수 있습니다.
*** 아무렴 가이드 강조, 기울게 글씨 보기 ***
실행 결과 :
글자에 밑줄 표시.
- 마크다운(Markdown)에서는 '__' 사용하면 글자에 밑줄 표시할 수 있습니다.
- <u> 태그도 사용할 수 있습니다.
__아무렴 가이드 밑줄 표시 글씨 보기__
<u> 아무럼 가이드 밑줄 표시 글씨 보기</u>
실행 결과 :
취소선 표시.
- 마크다운(Markdown)에서는 <del> 사용하면 취소선 표시할 수 있습니다.
<del> 아무럼 가이드 취소선 글씨 보기</del>
실행 결과 :
글자에 색상 적용.
- 마크다운(Markdown)에서 글자에 색상 적용하는 방법.
- 보통 html 태그와 같이 사용합니다.
<span style="color:blue">
아무렴 가이드 색상 표시하기
</span>
실행 결과 :
10. 마크다운(Markdown)에서 인용구(Quote) 사용하는 방법.
- '>' 사용하면 마크다운(Markdown)에서 인용구로 사용할 수 있습니다.
- 계층구조로 사용하고 싶다면 '>' 연속적으로 사용하면 가능합니다.
> 아우럼 가이드 인용 표시 1.
>> 아우럼 가이드 인용 표시 2-1.
>> 아우럼 가이드 인용 표시 2-2.
>>> 아우럼 가이드 인용 표시 3.
실행 결과 :
11. 마크다운(Markdown)에서 체크박스(checkbox) 사용법.
[] 체크가 되지 않은 체크박스 예제입니다.
[x] 체크가 되어 있는 체크박스 예제입니다.
실행 결과 :
12. 마크다운(Markdown)에서 표 만드는 기본적인 문법입니다.
- html에서 태그로 변환되는 '표(Table)'를 마크다운(Markdown)에서도 가능합니다.
- 테이블 헤더를 구분하기 위해, 3개 이상의 -(hyphen/dash) 기호를 사용합니다.
|아우럼1|아우럼2|아우럼3|아우럼4|아우럼5|
|---|---|---|---|---|
|내용1|내용2|내용3|내용4|내용5|
|내용1|내용2|내용3|내용4|내용5|
|내용1|내용2|내용3|내용4|내용5|
|내용1|내용2|내용3|내용4|내용5|
실행 결과 :
셀 정렬하는 방법.
- 테이블 헤더를 구분하며 :(Colons) 기호를 추가해 셀(열/칸) 안에 내용을 정렬할 수 있습니다.
- :--- 은 좌측 정렬을 표현합니다.
- :---:은 가운데 정렬을 표현합니다.
- ---:은 우측 정렬을 표현합니다.
|아우럼1|아우럼2|아우럼3|아우럼4|아우럼5|
|:---|---|:---:|---|---:|
|왼쪽정렬1|내용2|가운데정렬3|내용4|오른쪽정렬5|
|왼쪽정렬1|내용2|가운데정렬3|내용4|오른쪽정렬5|
|왼쪽정렬1|내용2|가운데정렬3|내용4|오른쪽정렬5|
|왼쪽정렬1|내용2|가운데정렬3|내용4|오른쪽정렬5|
실행 결과 :
표 만들 때 사용하는 tip.
- 버티컬바 기호 사용
- 마크다운에서 버티컬바(|) 기호는 테이블을 표현할 때 사용하는 문법인데,
- 만약 테이블 안에서 버티컬바(|) 출력하고 싶다면은, \이스케이프(Escape) 기호를 앞에 사용하시면 됩니다.
칸에 공백을 넣고 싶을 때는?
|아우럼1|아우럼2|아우럼3|
|:---|:---:|---:|
||내용1||
|||내용2|
|내용3|||
실행 결과 :
13. 마크다운(Markdown)에서 코드 블록(code block) 사용법.
마크다운(Markdown)에서 인라인으로 코드 사용하는 방법.
- 문장 중간 사이에 백 쿼트(`) 한 개를 사용해 입력하면 인라인으로 소스 코드를 표시할 수 있습니다.
변수 선언 코드는 `let numType = 123` 입니다.
실행 결과 :
마크다운(Markdown)에서 코드 블록으로 사용하는 방법.
- 백 쿼트(`) 세 개를 사용하여 코드 블록을 사용할 수 있음
```SQL
SELECT *
FROM DUAL
```
실행 결과 :
14. 마크다운(Markdown)에서 주석(Comment) 사용하는 방법.
- 주석(Comment)을 표현합니다. /**/
반응형