마크다운 + html 짬뽕 정리

기본 튜토리얼에 잘 나오지 않는 애들 정리

글씨

글씨 밑줄

html tag를 활용한 <ins>글씨 밑줄</ins>

html tag를 활용한 글씨 밑줄

글씨 색

<span color="blue">파란 글씨</span>가 너무 쓰고 싶었다!!

파란 글씨가 너무 쓰고 싶었다!!

배경 색

	<span style="color:blue;background-color: yellow">노란 배경에 파란 글씨</span>

노란 배경에 파란 글씨

이미지 (🚫)

+) 
이미지는 글 쓸때는 괜찮았는데 실제로 보면 엉망이네요.. 
그냥 문상훈 극성팬 되어버림,, ㅜ

이미지 사이즈 조정

{:width="75%"}

<img  src="https://velog.velcdn.com/images/moolsansam/post/7881222b-63f6-4340-99e0-dee4200e0e3b/image.jpeg" width="70%">
<img  src="https://velog.velcdn.com/images/moolsansam/post/7881222b-63f6-4340-99e0-dee4200e0e3b/image.jpeg" width="50%">
<img  src="https://velog.velcdn.com/images/moolsansam/post/7881222b-63f6-4340-99e0-dee4200e0e3b/image.jpeg" width="20%">

이미지 정렬

<figure>
    <img src="https://velog.velcdn.com/images/moolsansam/post/7881222b-63f6-4340-99e0-dee4200e0e3b/image.jpeg"width="30%"  align='right'>
    <figcaption>이미지 좌측 정렬</figcaption>
</figure>

이미지 좌측 정렬

이미지 캡션

<figure>
    <img src="https://velog.velcdn.com/images/moolsansam/post/7881222b-63f6-4340-99e0-dee4200e0e3b/image.jpeg"width="75%">
    <figcaption>75%상훈이도 부담스럽다</figcaption>
</figure>

75%상훈이도 부담스럽다

이미지 나란히 여러개

• 이게 제일 문제여!! 2개이미지.

table

인용

중첩 인용

>인용 1단
>>인용 2단
- 우왕
>>>인용 3단

인용 1단

인용 2단

• 우왕

  인용 3단

코드

인라인 코드

• 백틱(`) 을 사용해 인라인 코드를 작성
• 백틱(`): option 키+ 물결키

	`인라인 코드`
	<code>태그 인라인 코드</code>

인라인 코드
태그 인라인 코드

코드 블럭

• 백틱(`) 3개

	```
    코드 내용
    ```

코드 내용

코드 하이라이트

• 백틱(`) 3개 뒤에 원하는 언어

	``` python
    print("hello")
    ```

print("hello")

LaTex 문법 정리

• 당분간 쓸 계획은 없어서 ..
  https://cheris8.github.io/etc/MD-LaTex/

참고자료
https://www.markdownguide.org/hacks/#underline
https://daringfireball.net/projects/markdown/syntax#html