文章の目錄

• 1、什么是div標(biāo)簽和span標(biāo)簽
• 2、基本語法格式
• 3、常見的屬性
• 4、瀏覽器兼容性
• 5、使用場景
• 6、總結(jié)
• 寫在最后

---

div 和 span 是沒有語義的，是我們網(wǎng)頁布局主要的2個盒子，想必你一定聽過 css + div。

div 是 division 的縮寫，具有分割、分區(qū)的意思。
span，具有跨度，跨距，范圍的意思。

1、什么是div標(biāo)簽和span標(biāo)簽

<div> 標(biāo)簽（或 HTML 文檔分區(qū)元素）是一個通用型的流內(nèi)容容器，在不使用 CSS 的情況下，其對內(nèi)容或布局沒有任何影響。
<span> 標(biāo)簽是短語內(nèi)容的通用行內(nèi)容器，并沒有任何特殊語義。

2、基本語法格式

<div>這是div</div> <span>這是span</span>

3、常見的屬性

div 和 span 標(biāo)簽支持 HTML 中的全局屬性。

注意：

div 的 align 屬性已廢棄；請勿使用。應(yīng)當(dāng)使用 CSS Grid 或 CSS Flexbox 來對齊、定位頁面上的 <div> 元素；

4、瀏覽器兼容性

5、使用場景

<div> 元素在語義上不表示任何特定類型的內(nèi)容。div 可以將內(nèi)容分組，從而可以使用 class 或是 id 屬性方便的定義內(nèi)容的格式，也可以在一段文檔中劃分標(biāo)記出使用另一種語言書寫的內(nèi)容（使用lang 屬性）等等；

<div> 元素應(yīng)當(dāng)僅在沒有任何其它語義元素（比如 <article> 或 <nav>）時使用；

span 可以用來編組元素以達(dá)到某種樣式意圖（通過使用類或者 id 屬性），或者這些元素有著共同的屬性，比如 lang。應(yīng)該在沒有其他合適的語義元素時才使用它。<span> 與 <div> 標(biāo)簽很相似，但 <div> 是一個塊元素，而 <span> 則是行內(nèi)元素 。

6、總結(jié)

這兩個都是盒子，用來裝我們網(wǎng)頁元素的，只不過他們有區(qū)別，現(xiàn)在我們主要記住使用方法和特點(diǎn)就好了。

• div 標(biāo)簽，是用來布局的，但是現(xiàn)在一行只能放一個 div；
• div 的開始標(biāo)簽和結(jié)束標(biāo)簽都不能省略；
• span 標(biāo)簽，也是用來布局的，一行上可以放好多個 span；
• span 的開始標(biāo)簽和結(jié)束標(biāo)簽都不能省略；

寫在最后

如果你感覺文章不咋地//(ㄒoㄒ)//，就在評論處留言，作者繼續(xù)改進(jìn)；o_O???
如果你覺得該文章有一點(diǎn)點(diǎn)用處，可以給作者點(diǎn)個贊；\\*^o^*//
如果你想要和作者一起進(jìn)步，可以微信掃描二維碼，關(guān)注前端老L；~~~///(^v^)\\\~~~
謝謝各位讀者們啦(^_^)∠※！！！

總結(jié)

以上是生活随笔為你收集整理的HTML系列之div和span标签的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。