본문 바로가기
Reference/HTML

body 태그는 문서 본문에 해당하는 내용을 설정합니다.

by @webstoryboy 2022. 11. 1.
Reference/HTML

<body> 태그는 문서 본문에 해당하는 내용을 설정합니다.

by @webs 2022. 7. 4.

<body>

<body> 태그는 문서 본문에 해당하는 내용을 설정합니다. 문서에서 한번만 사용 할 수 있으며, 문서 설정시 필수적으로 들어가는 요소입니다. <body> 태그는 문서 본문에 해당하는 내용을 설정하지만, <head> 태그는 문서 정보에 해당하는 내용을 설정하는 것에 차이가 있습니다.


특징 설명
요소 블록 요소(Block Element)
닫는 태그 적용
버전 HTML4
시각적 표현 없음
사용성 ★★★★★

정의(Definition)

  • <body> 태그는 문서 본문에 해당하는 내용을 설정합니다.
  • <body> 태그는 문서에서 한 번만 사용됩니다.

문서와 관련된 태그(Document Related Tag)

  • <html> 태그는 문서의 최상단 요소를 나타냅니다.
  • <head> 태그는 문서 정보에 해당하는 내용을 설정합니다.
  • <body> 태그는 문서 본문에 해당하는 내용을 설정합니다.
  • <base> 태그는 문서의 기본 URL을 설정합니다.
  • <link> 태그는 문서의 외부 리소스를 설정합니다.
  • <meta> 태그는 문서의 메타 정보를 설정합니다.
  • <style> 태그는 문서의 스타일 정보 설정합니다.
  • <title> 태그는 문서의 제목을 설정합니다.

섹션과 관련된 태그(Section Related Tag)

  • <main> 태그는 문서의 주요 콘텐츠 섹션을 설정합니다.
  • <section> 태그는 주제별 그룹의 콘텐츠 섹션을 설정합니다.
  • <article> 태그는 문서의 독립적인 컨텐츠 섹션을 설정합니다.
  • <aside> 태그는 주요 콘텐츠의 보조적 컨텐츠 섹션을 설정합니다.
  • <header> 태그는 문서의 소개 및 메뉴 그룹 컨텐츠 섹션을 설정합니다.
  • <nav> 태그는 문서에 대한 메뉴 링크를 제공하는 섹션을 설정합니다.
  • <footer> 태그는 문서 관련 정보 및 관련 링크 콘텐츠 섹션을 설정합니다.
  • <address> 태그는 문서 관련 연락처 콘텐츠 섹션을 설정합니다.
  • <h1>~<h6> 태그는 각 섹션의 제목을 설정합니다.

속성(Property)

속성 값(예) 설명 버전
alink alink="black" 문서의 링크의 색상을 설정합니다. html5
background background="URL" 문서의 배경 이미지를 설정합니다. html5
bgcolor bgcolor="black" 문서의 백그라운드 색을 설정합니다. html5
bottommargin bottommargin="10px" 문서의 아래쪽 마진을 설정합니다. html5
leftmargin leftmargin="10px" 문서의 왼쪽 마진을 설정합니다. html5
link link="black" 문서에 방문하지 않은 링크의 색상을 설정합니다. html5
rightmargin rightmargin="10px" 문서의 오른쪽 마진을 설정합니다. html5
text text="black" 문서의 텍스트 색을 설정합니다. html5
topmargin topmargin="10px" 문서의 위쪽 마진을 설정합니다. html5
vlink vlink="black" 문서에 방문한 링크의 색상을 설정합니다. html5

예제1(Sample)

기본 문서 샘플 예제입니다.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <!-- 본문 내용을 작성하는 곳 -->
</body>
</html>

호환성(Compatibility)

크롬 아이콘 파이어폭스 아이콘 사파리 아이콘 오페라 아이콘 네이버 웨일 익스플로러6 아이콘6 익스플로러7 아이콘7 익스플로러8 아이콘8 익스플로러9 아이콘9 익스플로러10 아이콘10 익스플로러11 아이콘11 엣지 아이콘 안드로이드 아이콘 ios 아이콘
<body>

참고(Reference)


댓글