#4. Markdown 문법 정리(2)_링크, 이미지, 표, 코드 삽입

#3.Markdown 문법 정리(1)에 이어, 마크업 문법 정리 2탄.

여기를 누르면 ➡️, #3.Markdown 문법 정리(1)로 이동

---

6. 링크 삽입 : Links

• 대괄호, 소괄호와 컨텐츠만 있으면 손쉽게 링크 삽입 가능

형식) 
    [주소에 대한 설명 텍스트](URL) 

예시) 
    Click [고무라면의 테크 블로그](https://rubberramen.tistory.com/)

<결과>

Click 고무라면의 테크 블로그

---

7. 이미지 삽입 : Images

• 링크 삽입과 유사 : 링크 삽입 문법 앞에 느낌표(!)만 추가

  • 대괄호, 소괄호와 컨텐츠 + ! 를 사용해서 이미지 삽입
  • '이미지 이름 텍스트' 파트는 이미지가 깨지거나 오류가 발생할 시 대체로 뜨는 텍스트

• 참고) HTML 태그를 사용하면 사이즈 조절도 가능

형식) 
    ![이미지 이름 텍스트](URL or 해당 이미지 경로) 

예시) 
    ![image description](https://user-images.githubusercontent.com/61736137/102153953-b2881000-3ebb-11eb-9581-7026bc8e169e.jpg)

<결과>

---

8. 표 삽입 : Tables

• 문자와 데시(-)로 표를 만들 수 있음

|텍스트1|텍스트2|
|:--:|:--:|
|텍스트3|텍스트4|
|텍스트5|텍스트6|
|텍스트7|텍스트8|

<결과>

텍스트1	텍스트2
텍스트3	텍스트4
텍스트5	텍스트6
텍스트7	텍스트8

- ':'를 이용하여 정렬 가능(왼쪽, 오른쪽, 가운데 정렬)

|제목|내용|설명|
|:---|---:|:---:|    # 여기가 포인트!
|왼쪽정렬|오른쪽정렬|중앙정렬|
|왼쪽정렬|오른쪽정렬|중앙정렬|
|왼쪽정렬|오른쪽정렬|중앙정렬|

<결과>

텍스트1	텍스트2	텍스트3
왼	오른	중앙
왼	오른	중앙
왼	오른	중앙

---

9. 코드 삽입 : Code

• 백틱(```)를 활용
• 다양한 언어의 문법에 맞게 하일라이트 가능

    ```js
    // javascript
    console.log('hello world')  
    ```

    ```python
    # python
    print("hello world")
    ```

<결과>

// javascript
console.log('hello world')

# python
print("hello world")

---

<소회>

• 마크다운을 공부하다보니, 이 언어의 상위 개념인 마크업 언어에 대한 이해도 깊어짐
• 마크다운이 경량화된 마크업 언어라는 의미를 이해하게 됨
• 더불어, HTML이란 마크업 언어의 개념도 더욱 단단해짐