个人主页：学习前端的小z 个人专栏：HTML5和CSS3悦读 本专栏旨在分享记录每日学习的前端知识和学习笔记的归纳总结，欢迎大家在评论区交流讨论！
文章目录
✍HTML5 新增语义标签及属性1 HTML5 新增的块级语义化标签2 HTML5 新增的多媒体标签（了解）2.1 音频 audio2.2 视频 video
3 HTML5 新增的 input 类型（了解）
✍HTML5 新增语义标签及属性
1 HTML5 新增的块级语义化标签
以前布局，我们基本用 div 来做。div 对于搜索引擎来说，是没有语义的。
新增语义的意义：
开发人员可以更好维护Html文档搜索引擎它会读取到相关语义
注意：
这种语义化标准主要是针对搜索引擎的这些新标签页面中可以使用多次在 IE9 中，需要把这些元素转换为块级元素
article, aside, footer, header, menu, nav, section {
display: block;
}
2 HTML5 新增的多媒体标签（了解）
一般需要结合JS来实现音乐播放器或者视频播放器。这里了解即可。
新增的多媒体标签主要包含两个：
音频：
使用它们可以很方便的在页面中嵌入音频和视频，而不再去使用 flash 和其他浏览器插件。
2.1 音频 audio
HTML5 在不使用插件的情况下，也可以原生的支持音频格式文件的播放，当然，支持的格式是有限的。
当前
浏览器MP3WavOggInternet ExplorerYESNONOChromeYESYESYESFirefoxYESYESYESSafariYESYESNOOperaYESYESYES
语法
您的浏览器暂不支持
常见属性
属性值描述autoplayautoplay如果出现该属性，则音频在就绪后马上播放。controlscontrols如果出现该属性，则向用户显示音频控件（比如播放/暂停按钮）。looploop如果出现该属性，则每当音频结束时重新开始播放。srcURL规定音频文件的 URL。
谷歌浏览器禁止了autoplay，原因提升用户体验
2.2 视频 video
HTML5 在不使用插件的情况下，也可以原生的支持视频格式文件的播放，当然，支持的格式是有限的。
当前，
浏览器MP4WebMOggInternet ExplorerYESNONOChromeYESYESYESFirefoxYESYESYESSafariYESNONOOperaYES (从 Opera 25 起)YESYES
语法
您的浏览器暂不支持
常见属性
属性值描述autoplayautoplay如果出现该属性，则视频在就绪后马上播放。controlscontrols如果出现该属性，则向用户显示控件，比如播放按钮。heightpixels设置视频播放器的高度。looploop如果出现该属性，则当媒介文件完成播放后再次开始播放。srcURL要播放的视频的 URL。widthpixels设置视频播放器的宽度。
3 HTML5 新增的 input 类型（了解）
一般需要结合JS来实现数据提交。这里了解即可。
表单是用来做数据交互使用的。
新增 type 属性的属性值及其描述如下：
常用类型属性描述补充number仅限数字只能输入数字date日期选择年/月/日time时间选择00:00month时间选择月类型week时间选择周类型tel电话号码非有效限制email电子邮件非有效限制search查询框可点击 x 清除内容url地址框限制用户输入必须是url类型color颜色选择生成一个颜色选择类型
除 type 属性外，表单标签元素还新增了其他的属性：
常用属性属性值描述requiredrequired必填readonlyreadonly内容只读autofocusautofocus自动聚焦，页面加载完成自动聚焦到指定表单disableddisabled内容不可用
可以通过以下设置方式修改placeholder里面的字体颜色：
input::placeholder {
color: red;
}
精彩内容
您阅读本篇文章共花了：
发表评论