p標籤與span標籤的區別
直接上代碼
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
</style>
</head>
<body>
<p>我是p標籤</p>
<p>我是p標籤</p>
<span>我是span標籤</span>
<span>我是span標籤</span>
<p>我是p標籤</p>
<p>我是p標籤</p>
<span>我是span標籤</span>
<span>我是span標籤</span>
<p>我是p標籤</p>
<p>我是p標籤</p>
<span>我是span標籤</span>
<span>我是span標籤</span>
</body>
</html>
效果如下圖
f12直接看代碼
p標籤css
span標籤css
這裏我因爲我開了f12，所以p標籤774.4px其實就是當前window的max-width,莫非p標籤自動換行的緣故與width屬性有關？
重新貼代碼
<!DOCTYPE html>
<html>
<head>
<style type="text/css">
p{
width: auto !important;
}
</style>
</head>
<body>
<p style="width: auto !important;">我是p標籤</p>
<p>我是p標籤</p>
<span>我是span標籤</span>
<span>我是span標籤</span>
<p>我是p標籤</p>
<p>我是p標籤</p>
<span>我是span標籤</span>
<span>我是span標籤</span>
<p>我是p標籤</p>
<p>我是p標籤</p>
<span>我是span標籤</span>
<span>我是span標籤</span>
</body>
</html>
這裏的代碼給p標籤加了width:auto的樣式，但是在瀏覽器中執行效果如下圖
我去查看了一些資料，在w3c中找到了這樣一段描述：
當我把p標籤的display改成inline,style中的width自動變成auto
效果如下圖
看來p標籤與span標籤區別在於display，一個是block，一個是inline.