1. 程式人生 > >當inline元素包裹block元素時會發生什麽

當inline元素包裹block元素時會發生什麽

wid body 之前 自動跳轉 a標簽 pre bubuko 鏈接 也不會

經常有圖片鏈接寫法如下:

<a href="www.baidu.com"><img src="baidu.jpg" /></a>

點擊圖片自動跳轉,不用增加新的點擊事件,光標滑過時變成小手等等,這都是a標簽的功勞。

但是inline元素包裹block元素後,inline元素本身是否會變成blcok元素,還有待求證,於是做了如下對比:

<div>這裏是塊元素</div>
<span>用於測試(沒有包裹 a 標簽之前)</span>

技術分享圖片

猜想一下,被 a 標簽包裹之後 ,span 標簽是否會和 div 標簽處於同一行呢?(div即使設置了寬高也不會觸發BFC)

<a href="www.cnblogs.com"><div>這裏是塊元素</div></a>
    <span>用於測試(已經包裹 a 標簽)</span>

技術分享圖片

很明顯,a 標簽包裹block元素後變成了block元素。

當inline元素包裹block元素時會發生什麽