CSS image-set()与不同尺寸背景图加载实例页面

回到相关文章 »

效果:

加载的图片是?

代码:

CSS代码:
.image-set-by-zxx {
    width: 128px; height: 96px;
    background: url(./image-set-not.jpg);
    background: -webkit-image-set(url(../201410/mm-width-128px.jpg) 1x, url(../201410/mm-width-256px.jpg) 2x, url(../201410/mm-width-512px.jpg) 3x);
    background: image-set(url(../201410/mm-width-128px.jpg) 1x, url(../201410/mm-width-256px.jpg) 2x, url(../201410/mm-width-512px.jpg) 3x);
    background-size: cover;
}
HTML代码:
<h4>加载的图片是?</h4>
<div class="image-set-by-zxx"></div>