码迷,mamicode.com
首页 > 其他好文 > 详细

图片展示失效容错处理

时间:2016-09-08 22:59:56      阅读:108      评论:0      收藏:0      [点我收藏+]

标签:

用于当css样式失效时,能以文字显示内容提示,起个容错的处理】

 <a class="bg" href="#">淘宝网</a>

 

方法一:设置text-indent

  

.bg {
    width: 140px;
    height: 40px;
    background-image: url(‘taobao.jpg‘);
    /*设置以下即可*/
    text-indent: 9999px; /*使文字缩进溢出隐藏*/
    white-space: nowrap; /*不换行*/
    overflow: hidden; /*溢出隐藏*/
}

 

方法二、设置padding-top,height

.bg {
    width: 140px;
    background-image: url(‘taobao.jpg‘);
    /*通过设置height为0,和合适的padding-top,将文字向下挤出*/
    height: 0;
    padding-top: 40px;
    /*将挤出的文字隐藏*/
    overflow: hidden;
}

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

   

图片展示失效容错处理

标签:

原文地址:http://www.cnblogs.com/Walker-lyl/p/5854625.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!