<div>와 <span> 태그 차이 설명

2021. 5. 12. 14:54·개발/HTML

<div> 와 <span> 은 스타일링을 목적으로 존재하는 HTML 코드입니다. 이는 콘텐츠를 <p> 태그로 둘러싸면 하나의 문단임을 의미하는 것과는 다르게, 어떠한 의미론적 의미(semantic meaning)을 갖지 않는 스타일 코드입니다. 이러한 <div> 와 <span> 은 콘텐츠 일부에 특별한 스타일 효과를 적용할 수 있는 유용한 코드입니다.

<div> 태그 설명

<div> 태그는 블록 레벨 요소로 보통 긴 콘텐츠를 그룹핑하는 데 사용합니다. 이를 통해 웹페이지의 레이아웃을 구성할 수 있습니다.

<span> 태그 설명

<span> 태그는 인라인 레벨 요소로 보다 보통 블록 레벨 요소 내 적은 콘텐츠 텍스트를 그룹화하는 데 사용합니다.

<div>,<span> 활용 방법

<div> 와 <span> 은 보통 스타일링을 목적으로 class 와 id 속성과 함께 사용됩니다. 즉, 각 태그에 class 와 id 를 부여하고 각 클라스와 아이디 별로 스타일 속성을 그룹화하여 관리할 수 있습니다.

'개발 > HTML' 카테고리의 다른 글

DOM이란 무엇일까요?  (0) 2021.05.12
블록 요소와 인라인 요소의 차이와 태그 설명 ✔️  (0) 2021.05.12
HTML 기본 용어 요소, 태그, 속성 설명  (0) 2021.05.07
'개발/HTML' 카테고리의 다른 글
  • HTML에서 언어(lang)를 지정해주는 이유는 무엇일까요?
  • DOM이란 무엇일까요?
  • 블록 요소와 인라인 요소의 차이와 태그 설명 ✔️
  • HTML 기본 용어 요소, 태그, 속성 설명
휘Hwi
휘Hwi
여행, 사진, 개발, 책 이야기를 기록하는 여행자 휘의 블로그 𓂍
Klook.com
  • 휘Hwi
    휘: 끝나지 않은 이야기
    휘Hwi
  • 전체
    오늘
    어제
    • 분류 전체보기 N
      • 기록 N
        • 일상 에세이
        • 인사이트
        • 투자와 재테크
        • 코인 이야기
        • 아카이빙
        • 집무실 레터 N
        • 사랑에 대하여
        • 번역 이야기(完)
        • 프리랜서 일지(完)
      • 여행
        • 🌎 세계 여행기 S1 (完)
        • 🌊 삼삼한 여행기 (完)
        • 🚶 온더로드
        • 🇯🇵 일본
        • 🏝️ 발리
        • 🇻🇳 베트남
        • 🇱🇰 스리랑카
        • 🇮🇳 인도
        • 🇹🇭 태국
        • 🇸🇬 싱가포르
        • 🇦🇺 호주
        • 🇭🇰 홍콩
        • 🇰🇷 한국
        • 🍚 여행자의 한 끼
        • ℹ️ 여행 정보
      • 사진
        • 사진가
        • 사진 이론과 생각
        • 사진 관련 정보
      • 영상
        • 파이널컷 모션 공부
        • 고프로 GoPro
        • 영상 관련 정보
      • 책
        • 책 읽고 쓰기
      • 개발
        • 티스토리
        • Internet
        • HTML
        • CSS
        • JavaScript
        • Typescript
        • React
        • Node.js
        • Express
        • NestJS
        • Python
        • Django
        • MySQL
        • MongoDB
        • AWS
        • Deployment
        • Terminal
        • Git
        • Glossaries
        • Articles
        • Projects
        • TIL;
      • 미분류
  • 인기 글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.3
휘Hwi
<div>와 <span> 태그 차이 설명
상단으로

티스토리툴바