강조 태그, 첨자 태그, 밑줄 태그

0. HTML 태그를 쓰는 용도에 대하여 

HTML 태그는 정보의 종류를 구분하는데만 사용한다! 

디자인을 위해 사용하면 안된다!

현재 프론트 엔드의 디자인 정보는 CSS가 담당하고 있다!

1. 강조 태그 

(1) b와 strong 태그 

* 문법

<b></b>

<strong></strong>

* 차이

b는 단순히 안의 글자를 굵게 만드는 것이다. 디자인적 요소는 전부 CSS로 빠졌기 때문에 b를 단독으로 사용하는 경우는 현 시점에서 없다.

strong은 글자를 굵게 만드는 것 + 해당 내용이 중요하다는 의미까지 담고 있다. 따라서 구글 엔진은 해당 내용이 중요하다는 것을 인식할 수 있고, 관련 검색이 있을 시 우선적으로 띄어줄 수 있다. 

 

중요하다는 의미 없이 단순히 글자를 굵게 하고 싶을 경우 b 태그 + CSS 문법을 같이 사용한다. 

(2) i와 em 태그

* 문법

<i> </i>

<em></em>

* 차이

b와 strong의 관계와 마찬가지로 i는 단순히 글자를 기울일 뿐이고, em은 해당 글자들이 강조되는 내용이라는 정보도 담고 있다.따라서 i 혼자 단독으로 사용하는 경우는 현 시점엔 없다. 

디자인적 의미로 그저 글자를 기울이고 싶다면 i 태그 + CSS 사용하여 디자인한다.

 

(3)em과 strong 태그의 차이 

차이를 나누기 애매하다. strong은 문장에 강조를 두는 것이고, em은 우리가 언어를 말할 때 어떤 문장에 강세를 두는 것과 비슷하다고 생각하자.

2. 첨자 태그

(1) sup

^{위 첨자로 적힐 말}

지수와 서수라는 정보를 담고 있다. 

단지 디자인적으로 위 첨자를 쓰는 경우는 CSS를 이용 해야한다!

(2) sub 

_{아래 첨자로 적힐 말}

각주, 변수, 화학식이라는 의미를 담고 있다.

단지 디자인적으로 위 첨자를 쓰는 경우는 CSS를 이용 해야한다!

3. 밑줄 태그

(1) u

<u></u>

과거에는 그냥 밑줄 긋는 용도로 사용되지만, 

현재는 CSS와 함께 철자 오류를 강조하는 용도로 쓰인다. 

CSS 와 같이 쓰인 경우

지 혼자 썼을 때 모습

(2) s

<s></s>

사이에 문장 중앙을 가르는 선을 나타내고, 

더 이상 유효하지 않은 정보를 나타내는 취소선 의미한다.

 

4.스스로 해보기

경고! 이곳은 매우 위험합니다!

나는 당근을 사랑합니다.
나는 당근을 사랑합니다.
H₂O는 물 입니다.
x³은 3차식 입니다.
u는 밑줄인데, 요새는 CSS와 같이 철자 오류를 나타내는 용도로 쓰입니다. s는 취소선 으로서 필요 없는 말이라는 정보를 담을 때 사용합니다.