IE6、7下html标签间存在空白符,导致渲染后占用多余空白位置的原因及解决方法_html/css_WEB-ITnose

html教程评论445 views阅读模式

直接上图:

原因:该div包含的内容是靠后台进行print操作,输出的。如果没有输出任何内容,浏览器会默认给该空白区域添加空白符。

在IE6、7下,浏览器解析渲染时,会认为空白符也是占位置的,默认其具有字体的属性,所以也就出现“多余占位”的bug。

解决方法:

一、让html标签相接输出。例如:

。  ??太过麻烦,代码也不规则,不好维护。

二、设置font-size:0;  ??不能完美fix~

二、使用注释符 。例如:

,让div中间不存在空白符。  ??这种虽然能够fix问题,但是不够好

三、使用标签。例如:

。  ??这样,就可以让浏览器不自动给标签内容添加空白符,又不会出现多余的信息显示在页面上,完美解决~

补充知识:

wbr标签:作用是软断行,浏览器会根据容器的宽度,对文字内容进行自动断行

兼容性:

查看网址:http://www.quirksmode.org/oddsandends/wbr.html

  • 微信
  • 分享
  • IE6、7下html标签间存在空白符,导致渲染后占用多余空白位置的原因及解决方法_html/css_WEB-ITnose

  • 相关标签:IE6、7下html标签间存在空白符,导致渲染后占用多余空白位置的原因及解决方法
  • 本文原创发布php教程 ,转载请注明出处,感谢您的尊重!
    • 上一篇:优化数据页面(6)--用宽粗的字体突出标题行_html/css_WEB-ITnose
    • 下一篇:html title换行方法 如a链接标签内title属性鼠标悬停提示内容换行_html/css_WEB-ITnose

    相关文章

    相关视频

    • Html如何设置横向导航结构_HTML/Xhtml...
    • Html+css实现纯文字和带图标的按钮_HTML...
    • HTML对于元素水平垂直居中的探讨_HTML/Xh...
    • 修改输入框placeholder文字默认颜色-we...
    • IE6、7下html标签间存在空白符,导致渲染后占...
    • 轮播图案例讲解
    • 轮播图案例的预备知识(3)
    • 轮播图案例的预备知识(2)
    • 轮播图案例的预备知识(1)

    网友评论

    文明上网理性发言,请遵守 新闻评论服务协议

    我要评论

  • 立即提交

    专题推荐

    企鹅博客
    • 本文由 发表于 2019年9月8日 22:19:10
    • 转载请务必保留本文链接:https://www.qieseo.com/369486.html

    发表评论