텍스트를 한 줄로 표시하는 태그

<strong> 태그, <b> 태그 - 굵게 표시
텍스트 중에서 굵게 표시하려고 할 때 사용한다.

텍스트

z

 

<em> 태그, <i> 태그 - 이탤릭체로 표시
텍스트를 비스듬히 이탤릭체로 표시할 때는 <em> 태그나 <i> 태그를 사용한다.

텍스트

z

 

<q> 태그 - 인용 내용 표시
인용한 내용을 표시하기 위해 <q> 태그를 사용할 수 있다. <q> 태그가 <blockquote> 태그와 다른 점은 <blockquote> 태그는 블록 레벨 태그이기 때문에 인용 내용이 줄이 바뀌어 나타나고 다른 내용과 구별되도록 안으로 들여 써지지만 <q> 태그는 인라인 레벨 태그이기 때문에 줄바꿈 없이 다른 내용과 함께 한 줄로 표시되고 인용 내용을 구별할 수 있도록 인용 내용에 따옴표를 붙여 표시하는 점이다.

가나다라마바사아자차카타파하

<q>가나다라마바사아자차카타파하</q>

 

<mark> 태그 - 형광펜 효과
지정한 부분의 배경색이 노란색이 되며 형광펜으로 그어 놓은 듯한 효과를 낸다.

텍스트

<mark>텍스트</mark>

 

<span> 태그 - 줄바꿈 없이 영역 묶기
태그 자체로는 아무 의미가 없지만 텍스트 단락 안에서 줄바꿈 없이 일부 텍스트만 묶어 스타일을 적용하려고 할 때 주로 사용한다.

<span>내용</span>

 

<ruby> 태그 - 동아시아 글자 표시
<ruby> 태그는 주로 동아시아 국가들의 글자들에 주석을 함게 표기하기 위한 용도로 사용되며 주석으로 표시할 내용을 <ruby> 테그 안에 <rt> 태그로 표시한다.

내용주석

<ruby>내용<rt>주석</rt></ruby>