文章出處
一般運用a標簽包含img去實現點擊圖片跳轉的功能，這是前端經常要用到的東西。
今天遇到個神奇的bug：如果在img上再包裹一層div，而且div設置了width和height，則圖片區域點擊時，無任何響應。
出現這個bug的條件是：1.a標簽下包含div這樣的塊元素
2.塊元素必須設置width和height屬性值
3.該塊元素下包含img
解決方法:改結構或者讓三個條件的某一個失效就可以了
2015-05-22 補充
1.就算將a標簽設置為display:block;也同樣失效
2.只要不在img覆蓋的區域，a標簽點擊還是有效的
3.之所以這樣用，是想更多地以取巧的方式，利用a標簽的默認功能，實現簡單的跳轉，而不用寫多余的js代碼
4.可以利用:hover偽類，進行樣式的切換（這在低版本瀏覽器下，是最高效，直接的方式）
5.在高級瀏覽器，將a標簽display:block;，從意義上來說，不存在太大的問題（當然，裸css還是相當的慘）
 |
不含病毒。www.avast.com |
全站熱搜
留言列表
