扫描二维码,下载手机APP
下载安卓APP箭头
客服QQ
箭头给我发消息

客服QQ:3315713922
论坛 >编程语言 >HTML5响应式图片技术中文图解

HTML5响应式图片技术中文图解

希尔瓦娜斯发布于 2017-12-19 10:05查看:12109回复:1

        一、本文内容干货量远不及之前的那篇

          首先,需要声明,或者叫告知吧,就是,本文属于补充,真正关于响应式图片技术的干货内容参见我之前的“响应式图片srcset全新释义sizes属性w描述符”一文。

        另外,补充了一些遗漏的关于响应式图片处理的tips.

        1. 作为背景图片,image-set()这厮
        这个是我自己补充的,精力有限,我就不作图了,嘻嘻,使用示意如下(目前需要-webkit-私有前缀):

image.png

        兼容性如下:

image.png

        2. 尺寸固定,密度变化

image.png

        这里出现了srcset,兼容性如下:

image.png

        3. 尺寸和密度都变化

image.png

        4. 尺寸,密度,资源都变化

image.png

        5. 不同的图片类别

image.png




收藏(0)0
查看评分情况

全部评分

此主贴暂时没有点赞评分

总计:0

回复分享

版主推荐

    共有1条评论

    • 课课家运营团队
    • Mr ken
    • YUI
    • cappuccino
    • mr jack
    • IT宅男
    • Mright
    • 课课家技术团队1
    • 选择版块:

    • 标题:

    • 内容

    • 验证码:

    • 标题:

    • 内容

    • 选择版块:

    移动帖子x

    移动到: