最新的Web開發教程

HTML塊和內聯元素


每個HTML元素都有取決於它是什麼類型的元素的默認顯示值。 對於大多數元素的默認顯示值是塊或內聯。


塊級元素

塊級元素總是開始一個新行,並佔用可用的全寬(stretches out to the left and right as far as it can)

所述<div>元素是塊級元素。

塊級元素的實例:

  • <div>
  • <h1> - <h6>
  • <p>
  • <form>

內聯元素

內聯元素不啟動新行,只需要盡可能多的寬度是必要的。

這是一個內聯<span>元素的段

內聯元件的例子:

  • <span>
  • <a>
  • <img>

所述<div>

所述<div>元件是經常用作其他HTML元素的容器的塊級元素

所述<div>元素不具有所需屬性,但styleclass是常見的。

當與CSS一起使用時, <div>元素可用於的內容風格塊:

<div style="background-color:black; color:white; padding:20px;">

<h2>London</h2>
<p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>

</div>
試一試»

所述<span>

所述<span>元素是通常用作用於一些文本容器的內聯元件

所述<span>元件不具有所需屬性,但styleclass是常見的。

當與CSS一起使用時, <span>元件可用於文本的風格部分組成:

<h1>My <span style="color:red">Important</span> Heading</h1>
試一試»

HTML標籤分組

標籤 描述
<div> 定義的文檔的部分(block-level)
<span> 定義的文檔的部分(inline)