HTML | 地址 |
---|---|
HTML基础笔记 | HTML基础--超详细--零基础--简洁易懂_ddddddyu的博客-CSDN博客 |
HTML5进阶笔记 | HTML5进阶笔记--超详细--简洁易懂_ddddddyu的博客-CSDN博客 |
1 HTML5新增内容
- 新增语义化标签
- 新增音频视频标签
- 新增input类型
- 新增表单属性
广义的HTML5新增:
语义化标签
本地存储
兼容特性
2D、3D
动画、过渡
CSS3特性
性能与集成
2 新增语义化标签
header ---头部标签
nav ---导航标签
article ---内容标签
section ---块级标签
aside ---侧边栏标签
footer ---尾部标签
3 新增音频视频标签
分别是音频 audio和视频video
audio支持的音频格式
audio 的参数
<audio src="media/music.mp3" autoplay="autoplay" controls="controls"></audio>
属性 | 值 | 描述 |
---|---|---|
autoplay | autoplay | 如果出现该属性,则音频在就绪后马上播放 |
controls | controls | 如果出现该属性,则向用户显示控件,比如播放按钮 |
loop | loop | 如果出现该属性,则每当音频结束时重新开始播放 |
src | url | 要播放的音频的url |
video视频标签目前支持三种格式
video语法及属性
<video src="./media/video.mp4" controls="controls"></video>
属性 | 属性值 | 说明 |
---|---|---|
autoplay | autoplay | 视频就绪自动播放(谷歌浏览器需要添加muted来解决自动播放问题) |
controls | controls | 向用户显示播放控件 |
width | px | 设置播放器宽度 |
height | px | 设置播放器高度 |
loop | loop | 播放完是否继续播放该视频,循环播放 |
preload | auto(预先加载视频)none(不应加载视频) | 规定是否预加载视频(如果有了autoplay 就忽略该属性) |
src | url | 视频url的地址 |
poster | lmgurl | 加载等待的画面图片 |
muted | muted | 静音播放 |
4 新增input标签类型
- 重点记住: number tel search 这三个
5 新增表单属性
- 可以通过以下设置方式修改placeholder里面的字体颜色
input::placeholder {
color: red;
}