728x90
✔️ 디스플레이 태그
디스플레이 관련 태그는 웹 페이지에서 콘텐츠의 표시 방법과 레이아웃을 제어하는 데 사용된다. 주로 CSS(Cascading Style Sheets)와 함께 사용되며, 웹 페이지의 디자인 및 레이아웃을 조정하는 데에 큰 역할을 한다.
span: 글자의 속성을 다룬다.
div: 면의 속성을 다룬다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>디스플레이</title>
</head>
<body>
<h2>디스플레이</h2>
1. <span style="font-size: 30px; color: deeppink">span 태그 영역</span>입니다.
<div style="width: 600px; height: 300px; background-color: gold;">2. div 태그 영역</div>
</body>
</html>
👇
✔️ 시맨틱 태그
시맨틱 태그(sementic tags)는 HTML5에서 도입된 태그로, 문서의 구조와 의미를 더 명확하게 전달하기 위해 사용된다. 이러한 태그들은 웹 페이지의 콘텐츠를 구조화하고 의미를 부여하여 검색 엔진 및 개발자에게 페이지의 내용을 이해하기 쉽게 만든다.
<div> 태그와 같은 기능이나 의미적으로 이해할 수 있게 이름을 붙인 것.
- <header>: 문서나 섹션의 머리말을 정의한다.
- <nav>: 내비게이션 링크를 정의한다.
- <article>: 독립적으로 구분되거나 재사용 가능한 컨텐츠 영역을 정의한다.
- <section>: 문서의 섹션을 정의한다.
- <aside>: 주변 내용과는 관련이 적은 부가 정보를 포함하는 콘텐츠를 정의한다.
- <footer>: 문서나 섹션의 꼬리말을 정의한다.
728x90
'Web > html' 카테고리의 다른 글
| 10. 폼 태그 (0) | 2024.07.10 |
|---|---|
| 9. 아이프레임 태그 (0) | 2024.07.10 |
| 8. 테이블 태그 (0) | 2024.07.10 |
| 7. 하이퍼링크 태그 (0) | 2024.07.10 |
| 6. 이미지 태그 (0) | 2024.07.10 |
