你的位置:首页 > 软件开发 > 网页设计 > HTML中图文混合引发莫名空白问题研究

HTML中图文混合引发莫名空白问题研究

发布时间:2016-04-22 09:00:06
HTML5如火如荼,几个月前的项目要部分应用新技术,尤其是简单的文档类型声明<!DOCTYPE html>(不区分大小写),非常吸引人。中途因为IE8等在第一次打开网页时会阻止js执行,停在询问页面,导致新的标记无法识别使页面十分混乱而作罢,但doctype的简约定义 ...

HTML中图文混合引发莫名空白问题研究

HTML5如火如荼,几个月前的项目要部分应用新技术,尤其是简单的文档类型声明<!DOCTYPE html>(不区分大小写),非常吸引人。中途因为IE8等在第一次打开网页时会阻止js执行,停在询问页面,导致新的标记无法识别使页面十分混乱而作罢,但doctype的简约定义仍在使用。可是在后续做到上图下文的格式时,发现图片下方会出现莫名空白区域,经验上是没问题的,于是翻来覆去的比对,发现唯一不同只在doctype的定义了,替换成旧版的过渡模式确实就变好了,后来发现设置图片容器的line-height为0也可以,一直对付着用,今天又翻出这个问题,仔细研究下,发现是图片垂直方向对齐方式和line-height共同作用的结果。

测试代码如下:

<style type="text/css">

原标题:HTML中图文混合引发莫名空白问题研究

关键词:HTML

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。