HTML5--新增特性

新增语义化标签

HTML5引入了许多新的语义化标签，如<article>、<section>、<nav>、<header>、<footer>等。这些标签能够更好地描述和组织网页内容，提高SEO和网站的可访问性。

header：头部标签  nav：导航标签  article：内容标签  aside：侧边栏标签  footer：尾部标签 

section：定义文档某个区域。

新增多媒体标签

HTML5提供了<video>和<audio>元素，使得开发者可以直接在网页上嵌入视频和音频内容，而无需依赖外部插件（如Flash）。这提高了内容的可访问性和可定制性。

新增视频标签

 <video src=""></video>

属性	值	描述
autoplay	autoplay	视频就绪自动播放（谷歌浏览器需要添加muted来解决自动播放问题。
controls	controls	向用户显示播放控件
width	px	设置播放器宽度
height	px	设置播放器高度
loop	loop	播放完是否继续播放该视频，循环播放
preload	auto(预先加载视频) none(不应加载视频)	规定是否加载了视频（如果有autoplay 就忽略该属性）
src	url	视频url地址
poster	imgurl	加载等待的画面
muted	muted	静音播放

新增音频标签

<audio src=""></audio>

属性	值	描述
autoplay	autoplay	如果出现该属性，则音频在就绪后马上播放
controls	controls	如果出现该属性，则向用户显示控件，比如播放按钮
loop	loop	如果出现该属性，则每当音频结束时重新开始播放
src	url	音频地址

新增input表单

属性值	说明
type="email"	限制用户输入必须为Email类型
type="url"	限制用户输入必须为URL类型
type="date"	限制用户输入必须为日期类型
type="time"	限制用户输入必须为时间类型
type="month"	限制用户输入必须为月类型
type="week"	限制用户输入必须为周类型
type="number"	限制用户输入必须为数字类型
type="tel"	手机号码
type="search"	搜索框
type="color"	生成一个颜色选择表单

 <!-- 验证的时候必须要添加form表单域 -->
    <form action="">
        <ul>
            <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>
        </ul>
    </form>

新增表单属性

属性	值	说明
required	required	表单拥有该属性表示其内容不能为空，必填
placeholder	提示文本	表单的提示信息，存在默认值将不显示
autofocus	autofocus	自动聚焦属性，页面加载完成自动聚焦到指定表单
autocomplete	off/on	当用户在字段开始键入时，浏览器基于之前键入过的值，应该显示出在字段中填写的选项。 默认已经打开。 需要放在表单内，同时加上name属性，同时成功提交。
multiple	multiple	可以多选文件提交

 

<style>
        input::placeholder {
            color: blue;
        }
    </style>

 <form action="">
        <input type="search" name="sear" id="" required="required" placeholder="百度一下" autofocus="autofocus"
            autocomplete="on">
        <input type="submit" value="提交">
    </form>