728x90
01. 블록 레벨 요소(Block-level Elements)
블록 레벨 요소는 태그를 사용해 삽입했을 때, 혼자 한 줄을 차지하는 요소입니다. 자동으로 줄 바꿈이 일어나고 텍스트오 인라인 요소를 자식 요소로 포함할 수 있습니다. 블록 레벨 요소를 자식 요소로 포함할 수 있는 요소와 없는 요소가 있습니다.
01) 블록 레벨 예시
<!DOCTYPE HTML>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>블록 레벨 요소</title>
</head>
<body>
<h1>블록 레벨 요소</h1>
<h2>블록 레벨 요소 성질</h2>
<p>줄 바꿈이 생깁니다.</p>
</body>
</html>
02) 블록 레벨 태그
<address>, <article>, <aside>, <details>, <div>,
<figcaption>, <figure>, <footer>, <h1~h6>, <header>,
<hr>, <li>, <main>, <nav>, <ol>, <p>, <pre>,
<section>, <table>, <ul>···
02. 인라인 레벨 요소(Inline Element)
인라인 레벨 요소는 콘텐츠의 흐름을 끊지 않고, 요소를 구성하는 태그를 할당된 공간만 차지합니다. 인라인 레벨 요소는 줄 바꿈이 일어나지 않으며 텍스트와 인라인 요소를 자식 요소로 포함할 수 있습니다. 하지만 블록 레벨 요소를 자식 요소로 포함할 수 없습니다.
01) 인라인 레벨 예시
<!DOCTYPE HTML>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>인라인 요소</title>
</head>
<body>
<strong>인라인 요소</h1>
<span>인라인 요소는 한 줄로 출력됩니다.</span>
</body>
</html>
02) 인라인 레벨 태그
<a>, <br>, <button>, <code>, <data>,
<data>, <i>, <iframe>, <img>, <input>,
<label>, <object>, <script>, <select>, <span>, <strong>, <u>,
<var>···
728x90
반응형
'HTML' 카테고리의 다른 글
| [HTML]구조 관련 요소 (3) | 2022.08.14 |
|---|---|
| [HTML]웹표준, 웹접근성, 웹호환성 (10) | 2022.08.08 |
댓글