美文网首页前端学习笔记
网速不好对图片链接的处理

网速不好对图片链接的处理

作者: 红姑娘 | 来源:发表于2017-12-08 17:45 被阅读6次

    网速不好时候 页面会优先加载html

             <a href="http://www.taobao.com" target="_blank_">淘宝网</a>
    

    1.第一种处理方式如下

        a{
                        color: #424242;
            text-decoration: none;
            width: 190px;
            height: 140px;
            display: inline-block;
            border: 1px solid black;
            text-indent: 200px;/*通过缩进 显示在超出部分*/
            white-space: nowrap;/*强制不换行*/
            overflow: hidden;/*超出部分隐藏*/
            background-image: url("https://img.alicdn.com/tfs/TB1mIGsfZLJ8KJjy0FnXXcFDpXa-190-140.png");
        }
    

    2.第二种 设置高度为0 通过padding使图片显示出来 文字超出区域 溢出删除

        a{
            color: #424242;
            text-decoration: none;
            width: 190px;
            height: 0px;
            padding-top:140px;
            display: inline-block;
            border: 1px solid black;
            overflow:hidden;
            background-image:url("https://img.alicdn.com/tfs/TB1mIGsfZLJ8KJjy0FnXXcFDpXa-190-140.png");
            background-size: 190px 140px;
        }

    相关文章

      网友评论

        本文标题:网速不好对图片链接的处理

        本文链接:https://www.haomeiwen.com/subject/laxyixtx.html