[HTML] 블록태그와 인라인태그( Block Tag, Inline Tag) 종류와 차이점

블록태그와 인라인태그 종류과 차이점

모든 HTML 요소에는 요소 유형에 따라 기본 표시 값이 있습니다.
모든 표시 값에는 블록과 인라인 두 가지가 있습니다.

 

블록 태그, Block Tag

• 항상 새 줄에서 시작하고 브라우저는 자동으로 요소 앞뒤에 공백(여백)을 추가합니다.
• 자신의 내용만으로 한 라인을 독점해서 출력하는 태그입니다.
• 부모태그의 너비를 가져오고 높이는 자신의 태그의 자식태그의 높이를 가져옵니다.

블록태그 종류

<address>	<article>	<aside>	<blockquote>	<canvas>	<dd>
<div>	<dl>	<dt>	<fieldset>	<figcaption>	<figure>
<footer>	<form>	<h1>-<h6>	<header>	<hr>	<li>
<main>	<nav>	<noscript>	<ol>	<p>	<pre>
<section>	<table>	<tfoot>	<ul>	<video>

 

인라인 태그, Inline Tag

• 필요한 만큼만 너비를 차지합니다.
• 자신의 내용과 앞뒤 태그의 내용을 같은 라인에 출력하는 태그입니다.

인라인 태그 종류

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

 

---

정리!

 

다음 포스팅은 css란? 주제를 가지고 돌아오겠습니다. 개굴!

 

---

참고사이트!

https://seons-dev.tistory.com/entry/HTML-Block-Inline-Elements

[HTML] Block태그와 Inline 태그 종류와 차이점

https://sas-study.tistory.com/122

[HTML] 인라인태그와 블럭태그(div, span, ...) 종류, 비교