본문 바로가기
Programming/HTML, CSS

[HTML] HTML 태그 정리, 텍스트 관련 태그들 (인라인 요소)

by Bam_t 2020. 8. 19.
728x90

<b>, <strong> : 텍스트를 굵게 표시할 때 사용합니다. 둘을 눈으로 보았을때는 똑같아보입니다. 하지만 둘의 차이점은 화면 낭독기 기능에서 차이를 보입니다. 화면 낭독기가 <strong>태그의 텍스트를 읽을때는 그 부분을 강조해서 읽어줍니다. 반면 <b>태그는 낭독기가 따로 강조해주지 않습니다. 즉, <b>태그와 <strong>태그의 차이점은 굵은 글씨로 표시하는가와 강조의 의미를 담았는가의 차이라고 할 수 있습니다.

<b>, <strong>

 

<i>, <em> : 기울임꼴, 이탤릭체라고 부르는 방식으로 텍스트를 표시할 때 사용합니다. 위의 <b>태그의 경우와 마찬가지로 <i>태그는 단순히 이탤릭체 표시, <em>태그는 이탤릭체 표시를 강조할 때 사용합니다.

<i>, <em>

 

<q> : 인용구를 나타낼 때 사용합니다. 인용구를 표시하는 태그인 <blockqute>와의 차이점은 <blockquote>는 블록요소이므로 사용하면 줄바뀜과함께 들여쓰기가 되고, 한 줄을 차지합니다. 그러나 <q>태그는 인라인요소이기 때문에 한 문장 안에서 인용구를 사용할때 사용하게됩니다.

<q>

 

<span> : 텍스트안에서 일부분에만 스타일을 적용할 때 사용합니다.

<span>

 

<mark> : 형광펜과 같은 표시효과를 나타냅니다. css를 통해 색상변경이 가능합니다.

<mark>

 

<s> : 취소선을 그어줍니다.

<u> : 밑줄을 그어줍니다.

<s>, <u>

 

<sub> : 아랫첨자를 표시합니다.

<sup> : 윗첨자를 표시합니다.

<sub>, <sup>

 

<small> : 글자를 작게 표시합니다.

<small>

 

<code> : 브라우저 상에서 컴퓨터 소스코드를 보여주고 싶을때 사용합니다.

<code>

 

<kbd> : 키보드 입력에 관한 텍스트를 표시할때 사용합니다.

<kbd>

 

<abbr> : 약자를 표시할 때 사용합니다. title이라는 속성과 함께 쓰이기도 합니다.

<abbr>

 

<cite> : 발췌한 내용이나 참고를 표시할때 사용합니다.

<cite>

 

<ruby> : 일본어로된 신문이나 저서를 읽다보면 한자위에 히라가나등으로 읽는법 표기가 되어있는데, 웹 브라우저에서 독음을 표시하기 위해 사용하는 태그입니다. 사용법은 주석을 달아줄 문자를 <ruby>로 감싼 후 <rt>주석</rt>의 형태로 사용합니다.

<ruby>

728x90

댓글