img标签下多余空白BUG解决方法

根据原因的不同要用不同的解决方法,这里把解决直接把解决image图片布局下边的多余空隙的BUG的常用方法归纳,供大家参考。

在进行页面的DIV CSS排版时,遇到IE6(当然有时Firefox下也会偶遇)浏览器中的图片元素img下出现多余空白的问题绝对是常见的对于该问题的解决方法也是“见机行事”。

1、将图片转换为块级对象

即,设置img为“display:block;”。在本例中添加一组CSS代码:“#sub img {display:block;}”。

2、设置图片的垂直对齐方式

即设置图片的vertical-align属性为“top,text-top,bottom,text-bottom”也可以解决。如本例中增加一组CSS代码:“#sub img {vertical-align:top;}”。

3、设置父对象的文字大小为0px

即,在#sub中添加一行:“font-size:0;”可以解决问题。但这也引发了新的问题,在父对象中的文字都无法显示。就算文字部分被子对象括起来,设置子对象文字大小依然可以显示,但在CSS效验的时候会提示文字过小的错误。

4、改变父对象的属性

如果父对象的宽、高固定,图片大小随父对象而定,那么可以设置“overflow:hidden;”来解决。如本例中可以向#sub中添加以下代码:“width:88px;height:31px;overflow:hidden;”。

5、设置图片的浮动属性

即在本例中增加一行CSS代码:“#sub img {float:left;}”。如果要实现图文混排,这种方法是很好的选择。

6、取消图片标签和其父对象的最后一个结束标签之间的空格

这个方法要强调下,在实际开发中该方法可能会出乱子,因为在写代码的时候为了让代码更体现语义和层次清晰,难免要通过IDE提供代码缩进显示,这必然会让标签和其他标签换行显示,比如说DW的“套用源格式”命令。所以说这个方法可以供我们了解出现BUG的一种情况,具体解决方案的还得各位见招拆招了。

时间: 2024-12-31 02:36:33

img标签下多余空白BUG解决方法的相关文章

img标签下多余空白的解决方法

在进行页面的css.shtml' target='_blank' >div CSS排版时,遇到IE6(当然有时Firefox下也会偶遇)浏览器中的图片元素img下出现多余空白的问题绝对是常见的对于该问题的解决方法也是"见机行事". 1.将图片转换为块级对象 即,设置img为"display:block;".在本例中添加一组CSS代码:"#sub img {display:block;}". 2.设置图片的垂直对齐方式 即设置图片的verti

Thinkphp中volist标签mod控制一定记录的换行BUG解决方法_php实例

本文实例讲述了Thinkphp中volist标签mod控制一定记录的换行BUG解决方法.分享给大家供大家参考.具体方法如下: 一.BUG描述: 存在于thinkphp 2.0 版本 Mod属性还用于控制一定记录的换行,例如: 复制代码 代码如下: <volist name="list" id="vo" mod="5" > {$vo.name} <eq name="mod" value="4"

常用的10种CSS BUG解决方法与技巧

最常用的10种CSS BUG解决方法与技巧-浏览器兼容教程 CSS bug是布局中最头疼的问题.我们需要兼顾各种浏览器,以期待获得一致的效果. 非常遗憾的是各厂商之间的竞争导致很多问题的存在.而IE6与IE7在很多问题上也存在着很大的差别. 轻松的解决CSS bug是我们必须掌握的技能.现在整理出最常用的12种CSS BUG解决方法以及CSS BUG类的小技巧. 希望对您的学习.工作有所帮助,如果您依然有疑问, 一. 针对浏览器的选择器 这些选择器在你需要针对某款浏览器进行css设计时将非常有用

最常用的12种CSS BUG解决方法与技巧

最常用的12种CSS BUG解决方法与技巧 一. 针对浏览器的选择器 这些选择器在你需要针对某款浏览器进行css设计时将非常有用. IE6及其更低版本 * html {} IE7及其更低版本 *:first-child+html {} * html {} 仅针对IE7 *:first-child+html {} IE7和当代浏览器 html>body{} 仅当代浏览器(IE7不适用) html>/**/body{} Opera9及其更低版本 html:first-child {} Safari

js插件设置innerHTML时在IE8下提示“未知运行时错误”解决方法

  这篇文章主要介绍了js插件设置innerHTML时在IE8下提示"未知运行时错误"解决方法,较为详细的分析了错误的原因及对应的解决方法,需要的朋友可以参考下 本文实例讲述了js插件设置innerHTML时在IE8下提示"未知运行时错误"解决方法.分享给大家供大家参考.具体分析如下: 问题描述: 网站中使用了一个js插件,设置innerHTML时,在IE8下报错"未知运行时错误": ? 1 2 3 4 5 <div id="di

CSS应用:IE中img元素多出5px的空白的解决方法

嗯,开场先胡扯几句不相关地感言.最近的工作让我有了很多实践的机会,同时也让我收获颇丰.在群里聊天的时候也提到过,所有的学习过程,最好是理论-实践-再理论-再实践...的一个循环往复的过程.这里说的理论是个比较宽泛地概念,其中包括书本理论,也包括对实践地总结.只有理论没有实践,往往造成http://www.aliyun.com/zixun/aggregation/7232.html">眼高手低,想得好,做得差:只一味地实践却不通过理论地学习和总结,看起来好像忙忙碌碌,到头来会两手空空. 最近

ios8 beta4微信闪退bug解决方法

  ios8 beta4微信闪退怎么办?下文将告诉大家ios8 beta4微信闪退bug解决方法,有果粉表示升级beta4之后会出现微信群名片闪退现象,该如何解决呢?请看下文介绍吧. 法一.使用PP助手修复闪退,步骤请参考:"iphone5s软件闪退怎么办?iphone5s闪退修复工具使用教程". 法二.耐心等待beta5修复bug或微信官方修复.

关于onchange事件在IE和FF下的表现及解决方法

 本篇文章主要是对关于onchange事件在IE和FF下的表现及解决方法进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 在最近做的一个项目中,有这么一个功能点:页面上有一个checkbox,当用户选择或者取消选择该checkbox时会向后台发一个jsonp请求.当时的实现是为这个checkbox添加一个onchange事件,但结果却出人意料,为此,我深入的研究了一下,发现了onchange事件在IE和FF下的表现存在着以下问题.   问题①:在FF下,当改变checkbox的选中状态时

自己开发遇到的坑IE7 图片scrollTop BUG解决方法

IE7 图片scrollTop BUG解决方法: