Skip to content
조회 수 6392 추천 수 1 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
<p><b>이 텍스트는 b입니다.</b></p>
<p><strong>이 텍스트는 strong입니다.</strong></p>
<p><i>이 텍스트는 i입니다.</i></p>
<p><em>이 텍스트는 em입니다.</em></p>
<p>나는 <sub>sub</sub>와 <sup>sup</sup>입니다.</p>

이 텍스트는 b입니다.

이 텍스트는 strong입니다.

이 텍스트는 i입니다.

이 텍스트는 em입니다.

나는 subsup입니다.


위에서 보여지듯이 각종 텍스트 포맷 태그들을 이용해서 텍스트에 효과를 줄 수 있습니다.


<b>의 경우 bold, 즉 굵은 글씨체로 보이게 만드는 효과가 있고


<i>의 경우 italic, 이탤릭체라고 불리우는 오른쪽으로 살짝 기울어진 서양 글씨체로 보이게 만드는 효과가 있습니다.


<sub>는 아래 첨자, <sup>는 위 첨자로 변환해줍니다.


종종 <b>와 <strong>, <i>와 <em>은 같은 효과를 보입니다.


하지만 다음과 같은 경우에 각 태그는 서로 다른 의미를 가집니다.


<b>와 <i>는 각각 텍스트를 굵은 글씨체와 이탤릭체로 만드는데 그치지만


<strong>와 <em>은 유저로 하여금 중요하다고 인식시켜야할 내용이라는 의미적인 효과도 가지고 있습니다.


이 외의 텍스트 관련 태그를 알아보면 아래와 같습니다.



HTML 텍스트 포맷 태그


태그

설명

<b>

텍스트를 굵은 글씨체로 

<em>

텍스트를 강조(보통 이탤릭체 효과)

<i>

텍스트를 이탤릭체로 

<small>

텍스트를 기존 텍스트보다 작게

<strong>

텍스트를 중요한 텍스트로(보통 굵은 글씨 효과)

<sub>

텍스트를 아래 첨자로

<sup>

텍스트를 윗 첨자로 

 <ins>

텍스트를 삽입된 텍스트로 정의(보통 밑줄 효과)

 <del>

텍스트를 삭제된 텍스트로 정의 

 <mark>

텍스트를 하이라이트 처리 



HTML 컴퓨터 관련 텍스트 태그

태그

설명 

 <code>

 컴퓨터 코드 텍스트로 정의

<kbd> 

 키보드 텍스트로 정의

<samp>

 컴퓨터 코드 샘플 텍스트로 정의

<var>

 변수로 정의

 <pre>

 엔터와 띄워쓰기를 허용하는 서식설정 텍스트로 정의



HTML 인용/정의 관련 텍스트 태그

태그

설명 

 <abbr>

축약이나 약어 텍스트라고 정의

 <address>

문서의 저자나 주인과 연락할 수 있는 정보를 담은 텍스트라고 정의 

 <bdo>

텍스트의 방향을 정의. dir 속성 rtl, ltr

 <blockquote>

인용한 텍스트를 표현할 때 사용

<q>

짧은 인용 문구

<cite>

작품의 제목을 정의(책, 음악, 영화, 그림 등)

<dfn>

정의문



실제 텍스트 효과는 CSS를 통해 구현하는 편이고


텍스트 관련 태그는 각 의미별로 기억해서 의미에 따라 사용하는 것이 중요합니다.

?

Copyright by sincntx 2014 All rights reserved.

sketchbook5, 스케치북5

sketchbook5, 스케치북5