HTML5进阶笔记--超详细--简洁易懂

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;
}

猜你喜欢

转载自blog.csdn.net/m0_55644132/article/details/127560295