一起养成写作习惯！这是我参与「掘金日新计划 · 4 月更文挑战」的第6天，点击查看活动详情

你只能以最好的姿态面对你的野心 ----佚名

新增标签

<header>	头部标签
<nav>	导航标签
<article>	内容标签
<section>	定义文档某个区域 （相当于大号的div）
<aside>	侧边栏标签
<footer>	尾部标签

ps:这些新增标签均有兼容性问题

视频标签

<video>（尽量使用mp4格式）

在开发中我们有时会碰到打开一个网页就加载视频这种情况，这样的效果我们可以用视频标签来实现

属性	值	描述
autoplay	autoplay	视频自动播放，谷歌需要添加muted
controls	controls	播放控件
width
height
loop	loop	播放完视频是否继续播放
preload	auto（预先加载视频）none（不预先加载视频）	如果有了autoplay则自动忽略
scr
poster	imgurl	加载等待的画面图片
muted	muted	静音播放

举个栗子🎇🎇

<video src="video/mi12pro.mp4" autoplay="autoplay" controls="controls" style="width: 100%; height: 200px;" loop="loop" poster="images/mi12pro.png"></video>

当然前提是你要准备好一个视频片段呀🤞

来看看效果吧

很清楚的能够看见视频在自动播放

音频标签

音频标签和视频标签不外乎是同一类型，所用的控件也基本相同

<audio src="music/不为欢喜.m4a" autoplay="aotuplay" controls="controls"></audio>

新增表单及其他属性

属性	值	说明
required	required	必填选项
placeholder	提示文本	表单的提示信息
autofocus	autofocus	自动获取输入框光标
autocomplete	off/on	基于之前输入的值，在下一次输入时会有提示，但是要有namez值，还要成功提交过，默认on
multiple	multiple	可以多选文件提交<input type="file">只能选择单个文件

接下来我们用一个表单来试试

<form action="">
        <!-- action是指定服务器来处理表单里面的内容 -->
        <ul>
            <!-- ul>li*9>input -->
            <li>邮箱：<input type="email"></li>
            <li>网址：<input type="url"></li>
            <li>日期：<input type="date"></li>
            <li>日期：<input type="time"></li>
            <li>数量：<input type="number"></li>
            <li>手机号码：<input type="tel"></li>
            <li>搜索：<input type="search"></li>
            <li>颜色：<input type="color"></li>
            <li><input type="submit" value="提交"></li>
            <li><input type="search" name="sear" placeholder="啦啦啦啦啦啦啦啦啦" required="required" autofocus="autofocus" autocomplete="on"></li>
            <li><input type="file">只能选择单个文件</li>
            <li><input type="file" multiple="multiple">可以选择多个文件</li>

        </ul>
    </form>

效果如下（比较丑，见谅😁）

ps:大家可以比较一下type的属性值为file和multiple的差别✨

好啦今天就到这里，剩下的明天补上哦，辛苦掘金的运营小同学🥰🥰