[7일차] Block 요소 Inline 요소

블록은 한 개의 독립된 덩어리로 화면의 가로 폭 전체를 차지하는 요소

인라인은 컨텐츠 자신의 크기 만큼 영역을 가지는 요소

 

<div> 안녕 </div>

<span>안녕</span>

쉽죠잉

 

인라인은 height같은거 조정안되는데 dispaly:inlie block; 주면 조정가능

 

 

Block 요소들

 

<address>연락처 정보

<article>단락 콘텐츠

<aside>부가 콘텐츠

<blockquote>긴("블록")  인용구

<details>상세 정보 위젯

<dialog>대화상자

<dd>설명 목록의 정의 설명

<div>문서의 분할

<dl>설명 목록

<dt>설명 목록의 정의

<fieldset>필드 집합의 라벨

<figcaption>그림 설명

<figure>미디어 콘텐츠 그룹과 설명

 (<figcaption>을 참고하세요)

<footer>페이지나 구역의 푸터

<form>입력 폼

<h1>, <h2>, <h3>, <h4>, <h5>, <h6>1~6단계 제목

<header>페이지나 구역의 헤더

<hgroup>헤더 정보 그룹

<hr>수평선(구분선)

<li>목록의 항목

<main>문서에서 하나 뿐인 중심 콘텐츠

<nav>탐색 링크를 포함

<ol>정렬된 목록

p>문단

<pre>미리 서식 적용한 글

<section>웹 페이지의 구역

<table>표

<ul>정렬되지 않은 목록

 

 

Inline 요소들 - 조금 추림

 

<a>

<abbr>

<audio>
<br>

<button>

<cite>
<code>
<data>
<datalist>

<dfn>
<em>

<embed>

<i>

<iframe>

<img>
<input>
<label>
<map>

<mark>

<noscript>
<object>
<output>
<picture>

<script>
<select>
<span>

<sub>
<svg>

<teplate>
<textarea>

<var>
<video>
<wbr>