语法:
<img src=”图片的路径” alt=”对图片解释的笔墨” width=”” height=”” title=”解释笔墨”/>
实例:
<body>
<!--
img:图片标签,行内标签
src:图片的相对路径
alt:图片加载失落败时的解释
title:鼠标悬停时提示解释
width:宽 px %
height:高 px %
-->
<div>
<img src=\"大众imgs/1.jpg\"大众 width=\"大众200\"大众 alt=\"大众这是第一个手机\"大众 title=\"大众这是第一个手机\"大众/>
<img src=\"大众imgs/2.jpg\公众 width=\"大众200\公众 alt=\公众这是第二个手机\"大众 title=\公众这是第二个手机\"大众/>
</div>
</body>
把稳事变:
1. img 是行内标签,是单标签。
2. 多种图片格式都可以(jpg,bmp,png,gif)
3. 当我们修正图片宽度时,高度会根据图片宽度等比例缩放(反之亦然)
2.audio标签1.2.1 定义和用法
<audio>定义网页中的声音
语法:
<audio src=”音频文件的路径” autoplay=”autoplay”>
您的浏览器不支持audio标签
</audio>
实例:
<audio src=\"大众imgs/成功.mp3\公众 autoplay=\"大众autoplay\"大众 controls=\公众controls\"大众>
您的网页不支持音频播放,请升级您浏览器
</audio>
3.Video标签
语法:
<video src=”视频文件路径” controls=”controls”>
您的浏 览器不支持video标签,请升级
</video>
<!--
src:视频文件的路径
controls:视频播放器的掌握条
height:视频控件的高度
poster:视频下载或加载时显示的图像
autoplay:页面加载及播放
-->
<video src=\"大众imgs/video.mp4\"大众 controls=\"大众controls\"大众 height=\"大众400\"大众 poster=\"大众imgs/1.jpg\"大众 autoplay=\公众autoplay\"大众>
你的浏览器不支持
</video>
支持的格式:MPEG4、Ogg、MebM
4.Source标签source标签一样平常用于video标签、audio标签定义媒体资源。许可视频或音频根据浏览器的兼容性进行选择。
(1).选择得当的视频播放
<video width=\公众800\"大众 height=\公众\公众 controls=\公众controls\公众>
<source src=\"大众imgs/video.mp4\"大众 type=\公众video/mp4\"大众></source>
<source src=\"大众imgs/video.ogv\"大众 type=\"大众video/ogg\"大众></source>
<source src=\"大众myvideo.webm\"大众 type=\公众video/webm\"大众></source>
<object width=\"大众\公众 height=\"大众\公众 type=\"大众application/x-shockwave-flash\"大众 data=\"大众myvideo.swf\"大众>
<param name=\公众movie\公众 value=\公众myvideo.swf\"大众 />
<param name=\"大众flashvars\"大众 value=\公众autostart=true&file=myvideo.swf\公众 />
</object>
当前浏览器不支持 video直接播放,点击这里下载视频: <a href=\公众myvideo.webm\公众>下载视频</a>
</video>
(2). 选择得当的音频播放
<audio>
<source src=\公众imgs/video.mp3\"大众 type=\公众audio/mp3\"大众></source>
<source src=\公众imgs/video.mp4\公众 type=\"大众audio/mp4\公众></source>
</audio>
视频素材
视频加载中...
欢迎关注我的头条号,我将持续为大家更新web前端学习资料,感激