zoukankan      html  css  js  c++  java
  • IE8下图片无法显示问题

    一、背景图片不能显示的原因

    代码:

    background:url(img/img1.jpg)no-repeat;
    background:url(img/img1.jpg) no-repeat;
    

    第一个背景图片IE8下不会显示,第二行代码的背景图片会显示,区别在于no-repeat前面的空格,IE8对空格的敏感度很高。

    二、在HTML中插入图片不能显示

    HTML

    1 <div class="img">
    2     <a href='javascript:'>
    3         <img src="img/img1.jpg" alt="img">
    4     </a>
    5 </div>

    CSS:

    .img{
        width:200px;
        height:200px
    }
    
    .img a{
        display:inline-block;
        /*
        200px;
        height:200px;
        */
    }
    
    .img a img{
        width:200px;
        height:200px;
    }

    如果不给img标签的父元素a设置宽高的话,img在IE8下是无法显示的,因为a标签是无法继承div的宽高的(行内元素和行内块元素无法继承父元素的宽高,而块元素可以); 
    解决方法就是:设置a标签的宽高或者设置a为块元素(display:block);

    自己这些天在做项目的时候,就遇到了img标签无法显示的问题,这就尴尬了,下面一起来看下源代码:

    HTML代码:

    在浏览器中显示如下:

    试过了上面的第二种方法,发现还是无法改善。

    在IE下,我们发现一个问题:

    解决方案:

    重新保存图片为png格式即可,不一定是png,同理其他格式类型不可用也是同样道理 。

  • 相关阅读:
    GlusterFS 配置及使用
    zabbix-监控Linux服务器
    ansible安装及使用
    使用ansible 完成yum安装lamp环境
    mysql基础
    shell基础
    shell
    Javascript动画效果(四)
    Javascript动画效果(三)
    Javascript动画效果(二)
  • 原文地址:https://www.cnblogs.com/xuzhudong/p/6792588.html
Copyright © 2011-2022 走看看