HTML5学习笔记

HTML5学习笔记

IE9+以上浏览器兼容

新增的语义化标签

- 这种语义化标准主要是针对搜索引擎的
- 这些新标签页面中可以使用多次
- 在IE9中，需要把这些元素转换为块级元素 display: block
- 移动端更喜欢使用这些标签
<header> :头部标签
<nav>:导航标签
<article>内容标签
<section>:定义文档某个区域
<aside> :侧边栏标签
<footer> :尾部标签

image-20210415160729817

新增的多媒体标签

1.

当前<audio>元素支持三种视频格式MP3、Wav、Ogg，尽量使用mp3格式。
<audio src="文件地址" controls=" controls"></ audio>

<!--开发优化-->
<audio controls>
  <source src="horse.mp3" type="audio/mpeg">
  <source src="horse.ogg" type="audio/ogg">
  Your browser does not support this audio format.
</audio>

image-20210415165747670

2.

当前<video>元素支持三种视频格式MP4、WebM、Ogg，尽量使用mp4格式。
1. controls 属性供添加播放、暂停和音量控件。
2. <video> 与 </video> 之间插入的内容是供不支持 video 元素的浏览器显示的。
<video src="文件地址" controls="controls"></video>

<!--开发优化-->
<video controls="controls" width="300">
	<source src="move.ogg" type="video/ogg" >
	<souree src="move.mp4" type="video/mp4" >
	您的浏览器暂不支持<video>标签播放视频
</ video >

image-20210415164818736

新增的input类型

我们验证的时候必须添加form表单域

image-20210415170217357

新增的表单属性

我们验证的时候必须添加form表单域
input::placeholder{
		color: pink;
}

image-20210415171352091