상세 컨텐츠

본문 제목

[HTML 기초] 텍스트를 한 줄로 표시하는 태그

IT/HTML 및 CSS

by SINAFLA 2021. 3. 28. 13:59

본문

반응형

태그, 태그 - 굵게 표시하기

  • 텍스트 중에서 굵게 표시하려고 할 때 태그나 태그를 사용한다. 다른 내용과 구분하기 위해 단지 굵게 표시한 것이다.
<strong> 굵게 표시하기 1 </strong>
<b> 굵게 표시하기 2 </b>

 

태그, 태그 - 이탤릭체로 표시하기

  • 텍스트를 비스듬히 이탤리체로 표시할 때 태그나 태그를 사용한다.
  • 태그는 문장에서 흐름상 특정 부분을 강조하고 싶을 때 사용하고, 마음속의 생각이나 꿈, 기술적인 용어, 다른 언어의 관용구 등에는 태그를 사용한다.
<!DOCTYPE PUBLIC contentType="text/html; charset="utf-8">
<html>
    <head>
        <title>텍스트</title>
    </head>
    <body>
        <em> em태그를  이용했을 경우</em><br/>
        <i> i태그를 이용했을 경우 </i>
    </body>
</html>

실행 화면

<mark> 태그 - 형관펜 효과 내시

  • mark 태그는 선택한 부분의 배경색이 노란색이 되며 형광펜으로 그어 놓은 듯한 효과를 낸다.
<!DOCTYPE PUBLIC contentType="text/html; charset="utf-8">
<html>
    <head>
        <title>텍스트</title>
    </head>
    <body>
        동해물과 백두산이 마르고 닳도록. <mark>대한사람</mark> 대한으로 우리나라 만세
    </body>
</html>

실행 화면

 

태그 - 줄바꿈 없이 영역 묶기

  • 텍스트 단락 안에서 줄바꿈 없이 일부 텍스트만 묶어 스타일을 적용할 때 주로 사용한다.
<span>영역에 스타일을 적용할 경우 사용함</span>

 

태그 - 부가 정보처럼 작게 표시하기

  • 태그는 부가 정보처럼 작게 표시해도 되는 텍스트를 표시할 때 사용한다.
<!DOCTYPE PUBLIC contentType="text/html; charset="utf-8">
<html>
    <head>
        <title>텍스트</title>
    </head>
    <body>
        이 글은 글의 본문에 해당하는 내용입니다. 작게 표시하기 위해서는 <small>스몰태그를</small> 사용하면 됩니다.
    </body>
</html>

실행 화면

 

기타 텍스트 관련 태그

  • - 아래 첨자
  • - 위 첨자
  • - 취소선
  • - 밑줄
<!DOCTYPE PUBLIC contentType="text/html; charset="utf-8">
<html>
    <head>
        <title>텍스트</title>
    </head>
    <body>
        이 글은 글의 본문에 해당하는 내용입니다. 작게 표시하기 위해서는 <sub>윗첨자태그를</sub> 사용하면 됩니다.<br/>
        이 글은 글의 본문에 해당하는 내용입니다. 작게 표시하기 위해서는 <sup>아래첨자태그를</sup> 사용하면 됩니다.<br/>
        이 글은 글의 본문에 해당하는 내용입니다. 작게 표시하기 위해서는 <s>취소선태그를</s> 사용하면 됩니다.<br/>
        이 글은 글의 본문에 해당하는 내용입니다. 작게 표시하기 위해서는 <u>밑줄태그를</u> 사용하면 됩니다.<br/>
    </body>
</html>

실행 화면

반응형

관련글 더보기

댓글 영역