html5

@media
什么是响应式布局:一套代码，实现多种设备访问一致性(pc 平板 手机)
优点:保持一个域名URL 一套代码
缺点:浏览器支持方面(有些版本不支持，ie8和以下不兼容)

@media 使用
@media only screen and(max-width:700px){
}
only:可排除不支持媒体查询的浏览器
screen:设备类型
max-width:设备特性
设备小于700像素…

1 响应式图片
< picture>
< source srcset=‘路径’ media=’()’>//设置像素条件后现实的图片，写在media中
< img srcset=““>//默认图片
< /picture>