【HTML】09-多媒体标签及图片标签_多媒体标签中的图像标签-优快云博客

本文链接：https://blog.youkuaiyun.com/Jeffhan_java/article/details/123368889

<!--
    img标签：图片标签
        1.src属性：指向图片文件的路径
        2.width宽度：指定图片标签的宽度
        3.height高度：指定图片标签高度
        4.border属性：边框
        5.alt属性：图片加载失败时的代替文本
        6.title属性：提示文本
    多媒体标签：
        1.audio：音频标签
            src属性：指向音频文件的路径
            controls属性：开始控制面板
            autoplay属性：自动播放
            loop属性：循环播放
        2.video：视频标签
            src属性：指向视频文件的路径
            controls属性：开始控制面板
            autoplay属性：自动播放，必须静音
            loop属性：循环播放
            muted属性：静音
            width属性：设置视频宽度
            height属性：设置视频高度
            
            各浏览器对视频的兼容：
			格式    IE     Firefox      Opera      Chrome       Safari
			Ogg     No     3.5+         10.5+       5.0+         No
			MPEG4  9.0+     No           No         5.0+        3.0+
			WebM    No     4.0+         10.6+       6.0+         No
-->


<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>图片标签</title>
	</head>
	<body>
		<img src="img/spider.jpg" width="300px" border="10px" alt="图片加载失败" title="spider">
		<img src="img/spider.jpg" height="300px">
		<audio src="audio/李志-天空之城.mp3" controls="controls" loop="loop">
			当前浏览器不支持audio
		</audio>
		
		<video src="./video/fish.mp4" controls="controls" loop="loop" autoplay="autoplay" muted="muted" width="300px">
			当前浏览器不支持video
		</video>
		
		<video controls="controls" loop="loop" autoplay="autoplay" muted="muted" width="300px">
			<source src="video/fish.mp4" type="video/mp4" />
			<source src="video/fish.avi" type="video/avi" />
			当前浏览器不支持video
		</video>
	</body>
</html>