弹性图片

弹性图片指的是不给图片设置固定尺寸&＃xff0c;而是根据流体网格进行缩放&＃xff0c;用于适应各种网格的尺寸。而实现方法是比较简单&＃xff0c;一句代码就能搞定的事情。
img {max-width:100%;}

来看一个断点解决图片自适应的例子。

 

 

对应的CSS代码&＃xff1a;

 

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