请选择 进入手机版 | 继续访问电脑版
设为首页收藏本站
div css切图

网页切图论坛

 找回密码
 立即注册

QQ登录

只需一步,快速开始

切图广告位招租网站切图广告位招租
查看: 181|回复: 0

CSS设置的背景图片在IE7中点击消失

[复制链接]

1900

主题

0

听众

7911

积分

管理员

Rank: 9Rank: 9Rank: 9

  • TA的每日心情
    开心
    2018-1-16 20:02
  • 签到天数: 66 天

    连续签到: 1 天

    [LV.6]常住居民II

    发表于 2016-7-2 10:46:30 |显示全部楼层

    DIV+CSS中的时候你可能会遇见这样的情况,ie6和ff浏览器下面某个div的背景是可以正常显示的,但是ie7下却无端失踪了背景!???什么回事?原因很简单.假如css的盒子模型下,以下html代码:

    <div class="foot">
    <div class="font"><a>font</a></div>
    <div class="font2"><a>font2</a></div>
    </div>

    被设置的CSS代码为:

    .foot{
    margin-top:30px;
    padding-top:100px;
    border-bottom:10px solid #000;
    background:url(img.jpg) no-repeat;//img.jpg高为100px
    }
    .font{
    padding:5px
    }
    .font2{
    padding:10px
    }

    根据盒子模型,这个foot的div所占据的竖直方向的空间为30+100+10+里层div占据空间>140px,理论上除去上间隙的30px和下边框的10px剩下的填充+子层占据的空间里面应该可以出现高为100px的背景img.jpg,实际上IE6跟FF上面也出现了,但是IE7会因为foot(class是foot的div)里面的div(这里指的是font和font2)并没有设置高度而认为foot的高度是0,因此背景图片是看不见的。
    解决办法就很简单了:设置里层div高度(或者让里层div被撑大)或者直接设置foot的高度。当然直接设置foot的高度的话,里面子层div竖直占位发生变化,甚至超出foot范围时,就又要考虑div的自动扩展问题了。所以看着办吧。

    div css切图,网页切图制作
    回复

    使用道具 举报

    您需要登录后才可以回帖 登录 | 立即注册

    回顶部