為企業提供網站平臺解決方案

178 7892 1916

QQ客服:點擊這里給我發消息 點擊這里給我發消息

最新動態:

常見問題

你的位置:香港最准两码中特 > 建站知識 > 常見問題 > html5圖片img間隙解決方法

免费精准一肖两码中特:html5圖片img間隙解決方法

發布時間:2014-01-20 17:31作者:香港最准两码中特網址:香港最准两码中特瀏覽:次
同學都知道其中有個觀點,那就是html5的頭部doctype僅僅是針對驗證器的,而對于IE則是讓其按照標準模式表現的標記。 事實上標準瀏覽器在是否加doctype是一樣的。 但其實這其中還是有所差異,不知道是否是瀏覽器刻意而為還是什么原因,但它就是存在。 使用老式html/xhtml的
同學都知道其中有個觀點,那就是html5的頭部doctype僅僅是針對驗證器的,而對于IE則是讓其按照標準模式表現的標記。
事實上標準瀏覽器在是否加doctype是一樣的。
但其實這其中還是有所差異,不知道是否是瀏覽器刻意而為還是什么原因,但它就是存在。
使用老式html/xhtml的docytpe和html5的doctype的確存在細微差異
大家還記得圖片底部那3px的空隙么,可能有些同學納悶,那個空隙好像有些時候有有些時候沒有,沒錯,這個區別就在于doctype。
我們來看兩個例子:
xhtml://blog.dmtuan.com/demo/xhtml-html5/xhtml.html
html5://blog.dmtuan.com/demo/xhtml-html5/html5.html

 
請用火狐/chrome/ie8以上觀看,我發現在使用xhtml形式的doctype或者更老的html甚至不加doctype,在這些瀏覽器里圖片下面的3px間隙消失了。而在html5下卻又出現了
原來 html5 doctype激活 standard mode,xhtml1.0激活almost standard mode(限制性quick mode)
這里有一個詳細的列表來闡述兩者的區別。
其中提到了在quirks mode下img默認是block(去掉img下3px間隙的解決辦法之一)的,所以導致上面大家所見的。

解決方案:給圖片加上style="display:block;"
img src="images/opp7.png" style="display:block;"/>
<img src="images/opp8.png" style="display:block;"/>
<img src="images/opp9.png" style="display:block;"/>
<img src="images/opp10.png" style="display:block;"/>
幸运分分彩计划最准软件 腾讯分分彩漏洞刷钱 北京pk10单吊有啥规律 广东时时37期 片pk10赛车历史开奖记录 快乐时时开奖记录查询结果 有没有好的彩票计划软件 十二生肖本期开奖结果 七乐彩开奖的时间 杀3停1输5赢6什么意思 55彩票计划软件 欢乐生肖玩法规则 二肖三期内必开一期 秒速时时软件手机版 玩筛子比大小规则 3d杀码预测