[HTML] 텍스트 태그

2023. 2. 5. 04:42·HTML & CSS
728x90
728x90

텍스트를 묶어주는 태그

#  제목 표시

    - <h숫자> 텍스트 </h숫자>

        · 크기 : h1 > h2 > h3 > h4 > h5 > h6

 

#  단락 나누기

    - <p> 텍스트 </p>

 

#  줄 바꾸기

    - <br>

 

#  들여쓰기

    - <blockquote> 텍스트 </blockquote>

        · 다른 텍스트보다 안으로 들여 써짐

 

#  입력된 공백을 그대로 표시

    - <pre> 텍스트 </pre>

        · 해당 태그를 사용하지 않으면 코드 내 들여쓰기가 표현되지 않음

 

#  줄 바꿔 영역 묶기

    - <div> 텍스트 </div>

 

#  줄 바꿈 없이 영역 묶기 (인라인)

    - <span> 텍스트 </span>

    - 스타일 적용

        : <span style = "스타일속성 : 속성값;"> 텍스트 </span>

 

#  따옴표 추가

    - <q> 텍스트 </q>

        · 줄 바꿈 없이, 내용 앞뒤에 쌍따옴표를 추가함

 

#  수평 줄 생성

    - <hr>

        · 주제가 바뀔 때 분위기를 전환하는 용도

 

 

반응형
728x90

글자 효과 태그

#  굵게

  - <strong> 텍스트 </strong>

      · 보기에는 <b>와 똑같지만, 의미적으로 강조됨 (Sementic element)

  - <b> 텍스트 </b>

 

#  이탤릭체 (기울임)

  - <em> 텍스트 </em>

      · 보기에는 <i>와 똑같지만, 의미적으로 강조됨 (Sementic element)

  - <i> 텍스트 </i>

  - <cite> 텍스트 </cite>

      · 인용문을 삽입할 때 주로 사용함

 

#  글자 크기 작게

    - <small> 텍스트 </small>

 

#  형광펜

    - <mark> 텍스트 </mark>

 

#  취소선

    - <s> 텍스트 </s>

    - <del> 텍스트 </del>

 

#  밑줄

    - <u> 텍스트 </u>

    - <ins> 텍스트 </ins>

 

#  아래 첨자

    - <sub> 텍스트 </sub>

 

#  위 첨자

    - <sup> 텍스트 </sup>

 

 


주석 표시 태그

글자 위에 주석 표시

    - <ruby> 텍스트 <rt> 주석 </rt> </ruby>

 

약자 표시

    - <abbr title = “약자(주석)”> 텍스트 </abbr>

        · 텍스트 위에 커서를 올리면 약자(주석)이 표시됨

 

 


그 외 태그

공백 추가

    - &nbsp;

 

가운데 정렬

    - <center> 텍스트 </center>

 

소스 코드 형식으로 변경

    - <code> 코드 </code>

        · 들여쓰기까지 표현하려면 <pre> 태그 안에 넣기

320x100
반응형
저작자표시 (새창열림)

'HTML & CSS' 카테고리의 다른 글

[HTML] 이미지 태그  (0) 2023.02.05
[HTML] 링크 태그  (0) 2023.02.05
[HTML] 표 태그  (1) 2023.02.05
[HTML] 목록 태그  (0) 2023.02.05
[HTML] 개요  (0) 2023.02.01
'HTML & CSS' 카테고리의 다른 글
  • [HTML] 링크 태그
  • [HTML] 표 태그
  • [HTML] 목록 태그
  • [HTML] 개요
스응
스응
    반응형
    250x250
  • 스응
    이서영의 개발 블로그
    스응
  • 전체
    오늘
    어제
  • 글쓰기 관리
    • 분류 전체보기 (383)
      • Java (134)
        • Base (54)
        • Spring Boot (37)
        • JSP (16)
        • Swing (GUI) (20)
        • Design Pattern (7)
      • C# (13)
      • PHP (18)
      • SQL (27)
      • Vue.js (9)
      • Tailwind CSS (4)
      • TypeScript (7)
      • HTML & CSS (27)
      • JavaScript (26)
      • jQuery (10)
      • Android (3)
      • - - - - - - - - - - - - - - (0)
      • Hotkeys (5)
      • CS (30)
      • etc. (13)
      • Error Note (15)
      • Team Project (24)
        • Airlines Web Project (12)
        • University Web Project (6)
        • Strikers 1945 GUI Project (6)
      • My Project (18)
        • Library Web Project (8)
        • Pet Shopping Mall GUI Project (10)
  • 블로그 메뉴

    • Home
    • Write
  • 링크

    • 깃허브
  • 공지사항

  • 인기 글

  • 태그

    cs
    SQL
    오블완
    Hotkeys
    php
    C#
    jsp
    HTML
    Android
    errorNote
    java
    Swing
    typeScript
    티스토리챌린지
    git
    Codeigniter
    js
    tailwindcss
    개발일지
    vuejs
    Wordpress
    http
    면접
    zapier
    SpringBoot
    SEO
    CSS
    jQuery
  • 최근 댓글

  • hELLO· Designed By정상우.v4.10.0
스응
[HTML] 텍스트 태그
상단으로

티스토리툴바