1、video元素可以通过src属性加载视频，里面可以放内容，在浏览器不支持video元素时会显示该内容。因为各个浏览器存在支持不同视频格式的缘故，所以一般用source来加载视频，保证各个浏览器能有其对应的可播放是视频格式。用source标签浏览器只会匹配第一个浏览器兼容的视频。
<video controls>
<source src="rabbit320.mp4" type="video/mp4">
<source src="rabbit320.webm" type="video/webm">
<p>你的浏览器不支持 HTML5 视频。可点击<a href="rabbit320.mp4">此链接</a>观看</p>
</video>
2、对于不支持SVG（IE 8及更低版本，Android 2.3及更低版本）的浏览器，您可以从src属性引用PNG或JPG，并使用srcset属性 只有最近的浏览器才能识别）来引用SVG。
响应式图片的应用：
以前的理解：
就是之前那个老师教的那样吧，用@media(XXX)来控制图片的样式大小，是通过css的@规则来控制的，这很显然是可以的，但不管是那种情况下一直用的都是同一张图片，可能会造成小图片被拉大时模糊的情况。
现在的理解：
html里面的img本来就提供一个属性srcset来控制大小的情况，srcset是包含多个不同尺寸的图片，再通过size属性的媒体查询控制应该选用那张合适的照片，这很合理啊。
之前老师为什么这教，我感觉是因为在bootstrap框架里面才这么教吧，因为在这框架里主要使用它的css和js，用css也很合理，如果不是bootstrap框架的网页还是用srcset吧。
特别注意： google chorme用不了srcset，不知道为什么，要用firefox才行。这是第一次感觉浏览器的差异了。