在HTML的網頁布局裡div與span有什麼區別

很多剛入行的朋友不是很懂這倆個標籤的區別，可能大家認為SPAN也是一塊，DIV也是一塊，同樣的作用為啥有倆個標籤呢？本篇文章就給大家解答這個疑惑。

DIV與SPAN的區別與特點

以下是在沒有對開發網頁版面設定css樣式時候情況下，系統預設情況下的介紹
div與span區別
div佔用的位置是一行，
span佔用的是內容有多寬就佔用多寬的空間距離

分析：從很容易知道“我是內容一；用的div”和“我是內容二；用的div”兩個內容外部用的是<div>標籤，他們得到樣式是佔用了一排空間（相當於換行一樣）；而“我是內容三；用的span”和“我是內容四；用的span”則，文字內容有多寬，就佔用多寬距離，使用<span>標籤和不使用一樣效果。

span標籤小結

在網頁開發的時候使用div和span都可以，通常可以理解為沒有什麼區別。但注意的是div佔用一行，span不會佔用一行，內容佔多大寬度，span就有多寬。

擴充與提升

div內的span無需命名css選取器偽類，例子如下
如果div的class為yangshi，則對內的span設定css屬性則，代碼如下
.yanshi span{屬性及屬性值}

相信看了這些案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

相關閱讀：

CSS裡的盒子模型的種類區別

Css3製作動態開關的效果的實現步驟

CSS3的content屬性實現步驟