移动开发【1】 HTML5 的标签

最新推荐文章于 2021-12-12 17:55:02 发布

椰子奶糖

最新推荐文章于 2021-12-12 17:55:02 发布

阅读量2.1k

点赞数

分类专栏： # 移动端WEB学习记录

本文链接：https://blog.csdn.net/symuamua/article/details/104775080

版权

移动端WEB学习记录专栏收录该内容

14 篇文章 0 订阅

订阅专栏

语义化标签

在这里插入图片描述

	<header></header>
	<nav></nav>
	<article></article>
	<aside></aside>
	<footer></footer>

标签即

多媒体标签

<audio>
.属性：
- autoplay：自动播放
- controls：控制界面
- loop：循环
- src ：URL
PS：chorme静止了自动播放
示例

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <section>
        <audio controls autoplay loop >
			<source src="media/1.mp4">
            您的浏览器暂时比支持audio
		</audio>
    </section>
</body>
</html>

<video>
属性：
- autoplay：自动播放
- controls：控制界面
- width：宽
- height：高
- preload：是否等待加载完毕再播放
- poster：加载等待的图片
- muted：静音播放
- loop：循环
- src ：URL
PS：chorme静止了自动播放，但是，当设置静音播放的时候，是可以自动播放的，比如下面的例子，设置的自动静音循环播放

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <video autoplay muted loop>
            <source src="media/1.mp4">
            您的浏览器不支持vedio
    </video>
</body>
</html>

未完待续。。。

椰子奶糖

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
打赏
0
评论
移动开发【1】 HTML5 的标签

语义化标签 <header></header> <nav></nav> <article></article> <aside></aside> <footer></footer>多媒体标签<audio>.属性：autoplay：自动...
复制链接

扫一扫