css中使用content和attr做响应式图片替换无法实现

Question

w3cplus中有短代码：

<img src="image.jpg" data-src-600px="image-600px.jpg" data-src-800px="image-800px.jpg" alt="">

@media (min-device-width:600px) {  
    img[data-src-600px] {    
        content: attr(data-src-600px, url);  
    }
}
@media (min-device-width:800px) {  
    img[data-src-800px] {    
        content: attr(data-src-800px, url);
  }
}

原文网址http://www.w3cplus.com/css3/responsive-web-design.html

测试没有效果，而且这里css的url我换成src依然无效果=_=，求大家帮忙找原因！谢谢

Answer 1

是不是屏幕大小没达到要求 所以没有触发