首頁 > web前端 > html教學 > 元素换行产生空白间隙问题_html/css_WEB-ITnose

元素换行产生空白间隙问题_html/css_WEB-ITnose

WBOY
發布: 2016-06-24 12:05:52
原創
1583 人瀏覽過

(1)两个元素,其中一个是块级元素,则一定会换行,换行后,上下两个元素之间会产生空白间隙行
(2)两个都是行内元素,但是行内元素的宽度超过父元素的宽度则自动换行,换行后,上下两个元素之间会产生空白间隙行

我想知道这个空白间隙行产生的原因及解决方法,哪位大神知道的,给小弟讲解下,不甚感激。


回复讨论(解决方案)

应该是浏览器的默认样式。
firebug观察下元素的样式?
一般css开头重置样式表,加入 margin:0;padding 0;啥的,去掉默认的margin和padding

其实类似这样的问题,完全可以去避免,最头疼的就是明知不可为而为之
1)既然实现的效果不再一排显示,那么你完全可以两个块级元素,或者 浮动后设置宽度也行
2)子级超出父级,本身就带有兼容性问题,且在IE6下会撑开父级,你可以设置overflow:hidden

另外 显示为 diplay:inline-block;的元素,同排显示,代码换行会被解析,也就是所谓的空白间隙,没什么解决方案,就是浮动,你可以把浮动理解为升级版的 diplay:inline-block;

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板