论坛首页 Web前端技术论坛

DOCTYPE声明导致布局中div与图片相差5像素的bug

浏览 1812 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2013-04-18  
最近一次把网站html头部的声明由
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

改成了
<!DOCTYPE html>


接下来便出现了一些细微的bug。突然发现某些没有设置图片div块会出现相差5像素的bug。
举例代码如下:
<div>
  <img src="demo.jpg" alt="" width="100" height="100" border="0">
</div>

当没有设置div高度的时候。在chrome中审查元素会发现div的高度是105像素。

现在的解决办法就是
1、把声明改回为
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

2、对没有设定高度的图片div块进行高度设置
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics