[HTML] 서식 태그(b, i, small, sub, sup, big, u, strike, tt 등)

🔻HTML 서식 태그🔻

HTML은 골격 구성 + 데이터 표현 + 서식 기능을 가지고 있다.

서식 기능 및 디자인은 CSS에서 담당하기에 HTML에서 잘 사용하지 않지만, 아래 기능들은 HTML에서 적용하는게 간편하여 잘 사용되고 있는 서식들이다.

 

 

1. <b> : 볼드체, 굵은 글씨

2. <i> : 이태릭체, 텍스트 기울기

3. <small> : 말그대로 다른 글씨보다 작은 폰트로 출력한다.

4. <sub> : 밑첨자

5. <sup> : 윗첨자

6. <big> : 다른 글씨보다 큰 폰트로 출력한다.

7. <u> : 밑줄

8. <strike> : 취소선

9. <tt> : 타자기 폰트로 출력한다.

<!-- 	아래 6개는 아직 html에서 사용하는게 편한 태그들이다(***기억해두기) -->
	<h1></h1>
	<h2>물리적인 모양을 지정하는 태그</h2>
	<b>볼드체</b><br>
	<i>이태릭체</i><br>
	<small>작은글자</small><br>
	
	H<sub>2</sub>0<br><!-- 밑첨자-->
	MC<sup>2</sup><br><!-- 윗첨자-->
	
	<!-- 주로 css로 적용한다. html에서 퇴출 예정이기에 코드에서 노란색 밑줄이 생긴다.-->
	<big>큰글자</big><br>
	<u>밑줄</u><br>
	<strike>취소선</strike><br>
	<tt>타자기 글자</tt><br>

 

여기서부터는 서식 뿐 아니라 코드의 의미를 담고 있는 서식들이다.

시멘틱 웹이라고도 하는데

웹에서 정보를 더 의미론적으로 이해하고 활용할 수 있도록 하는 기술적인 접근 방식이다.

이를 통해 기존의 문서 검색을 넘어, 컴퓨터가 웹에서 제공되는 정보를 이해하고 활용할 수 있게 된다.

 

10. <strong> : 중요한 데이터의 의미로 굵은 글씨로 출력한다.

11. <em> : strong 보다는 조금 덜 중요한 데이터의 의미로 기울어진 글씨로 출력한다.

12. <mark> : 형광펜을 그은 것처럼 출력한다.

13. <cite> : 한줄 인용구

14. <blockquote> : 여러줄 인용구

15. <code> : 코드를 의미하여 웹 번역 시, 번역에 제외되어 문장을 매끄럽고 의미있게 볼 수 있다.

16. <adress> : 지도와 연동될 때 사용하는 태그이다.

17. <ins> : 데이터가 추가됨을 의미하고 밑줄로 출력한다.

18. <del> : 데이터가 삭제됨을 의미하고 취소선으로 출력한다.

<h2>의미를 중시하는 태그(***)시멘틱웹</h2>
	<strong>중요한 데이터</strong><br>
	<em>조금 덜 중요한 데이터</em><br>
	<mark>강조 데이터</mark><br>
	<cite>한줄 인용구</cite><br>
	<blockquote>여러줄 인용구</blockquote><br>
	<code>int a = 10;</code><br>
	<adress>서울시 강남구 역삼동</adress><br>
	<ins>추가된 데이터</ins><br>
	<del>삭제된 데이터</del><br>

 

 

 

++ 'ArrayIndexOutOfBounds Exception'을 <code> 태그로 감쌓을 때

아래처럼 'ArrayIndexOutOfBounds Exception'을 제외하고 번역이 된다.

번역 전

 

번역 후