[html] inline tag 와 block tag

html 요소들은 각 요소에 따른 기본 표시값이 있습니다.

크게 block과 inline 요소가 있습니다.

block 은 페이지에서 전체 너비를 차지하는 요소로 자동으로 줄 바꿈이 되는 태그입니다. 주로 레이아웃 영역을 만들 때 사용합니다.

inline은 줄바꿈이 일어나지 않고 필요한 만큼만 너비를 차지하는 태그입니다.

 

✨ block tag

대표적인 태그로는 <div>가 있습니다.

그 외

<address>, <article>, <aside>, <audio>, <blockquote>, <canvas>, <dd>, <div>, <dl>, <fieldset>, <figcaption>, <figure>, <footer>, <form>, <h1>, <h2>, <h3>, <h4>, <h5>, <h6>, <header>, <hgroup>, <hr>, <noscript>, <ol>, <output>, <p>, <pre>, <section>, <table>, <ul>, <video>

 

✨ inline tag

대표적인 태그로는 <span>이 있습니다.

그 외 

<a>, <abbr>, <acronym>, <b>, <bdo>, <big>, <br/>, <button>, <cite>, <code>, <dfn>, <em>, <i>, <img>, <input>, <kbd>, <label>, <map>, <object>, <q>, <samp>, <small>, <script>, <select>, <span>, <strong>, <sub>, <sup>, <textarea>, <tt>, <var>

 

✨ 중첩

이러한 속성들은 중첩에 유의해야 합니다.

block 태그 안에는 inline, block 둘 다 올 수 있습니다.inline 안에는 inline 만 가능합니다. (block 태그는 올 수 없음)