본문으로 건너뛰기

<body> 태그

body 태그

<body> 태그는 웹 페이지에 실제로 표시되는 내용을 담습니다.

사용자와 상호작용하는 모든 웹 콘텐츠는 body 태그 안에 위치해야 합니다.


Body 주요 요소

body 태그 안에 다양한 요소들을 포함해 웹페이지를 풍성하게 구성할 수 있습니다.


텍스트 요소

웹페이지에서 텍스트 내용을 표시할 때 사용하는 태그들입니다.

  • <h1>, <h2> ... <h6>: 제목 또는 부제목을 나타내는 태그입니다.

  • <p>: 단락을 나타내는 태그입니다.

제목과 단락 표시
<body>
<h1>환영합니다!</h1>
<p>이곳은 나의 첫 웹페이지입니다.</p>
</body>

이미지, 비디오, 오디오

  • <img>: 이미지를 표시하는 태그

  • <video>: 비디오를 표시하는 태그

  • <audio>: 오디오를 표시하는 태그

img, video, audio 태그
<body>
<img src="myimage.jpg" alt="나의 사진" />
<video src="myvideo.mp4" controls></video>
<audio src="mysong.mp3" controls></audio>
</body>

목록

정렬된 목록이나 순서가 없는 목록을 만드는데 사용합니다.

  • <ul>: 순서 없는 목록 (Unordered List)

  • <ol>: 번호가 매겨지는 순서 있는 목록 (Ordered List)

  • <li>: 목록 내의 항목 (List Item)

ul, li 태그
<body>
<!-- 순서 없는 목록 -->
<ul>
<li>사과</li>
<li>바나나</li>
</ul>
</body>

링크

  • <a>: 다른 페이지나 웹사이트로 이동할 수 있는 하이퍼 링크를 생성합니다.
a 태그
<body>
<a href="https://www.example.com">example.com로 이동</a>
</body>

실습

코드의 별표로 강조된 부분을 따라 입력해 보세요.