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
<sup> 위 첨자로 적힐 말 </sup>
지수와 서수라는 정보를 담고 있다.
단지 디자인적으로 위 첨자를 쓰는 경우는 CSS를 이용 해야한다!
(2) sub
<sub> 아래 첨자로 적힐 말 </sub>
각주, 변수, 화학식이라는 의미를 담고 있다.
단지 디자인적으로 위 첨자를 쓰는 경우는 CSS를 이용 해야한다!
3. 밑줄 태그
(1) u
<u></u>
과거에는 그냥 밑줄 긋는 용도로 사용되지만,
현재는 CSS와 함께 철자 오류를 강조하는 용도로 쓰인다.
(2) s
<s></s>
사이에 문장 중앙을 가르는 선을 나타내고,
더 이상 유효하지 않은 정보를 나타내는 취소선 의미한다.
4.스스로 해보기
경고! 이곳은 매우 위험합니다!
나는 당근을 사랑합니다.
나는 당근을 사랑합니다.
H2O는 물 입니다.
x3은 3차식 입니다.
u는 밑줄인데, 요새는 CSS와 같이 철자 오류를 나타내는 용도로 쓰입니다.
s는 취소선 으로서 필요 없는 말이라는 정보를 담을 때 사용합니다.
'프론트엔드 개발 > HTML, CSS - 이론' 카테고리의 다른 글
[HTML] 리스트 나열 TAG, 용어 정의 TAG (0) | 2023.02.07 |
---|---|
인용문 태그, 강조문 태그, 축약어 설명 태그 (0) | 2023.02.07 |
제목과 태그 (0) | 2023.02.02 |
VSCODE로 마크업 언어 공부 전 세팅 해놓 으면 좋은 것 (0) | 2023.02.02 |
HTML_생활코딩_10강 웹페이지는 접근성을 우선적으로 생각 (0) | 2023.01.29 |