【前端学习Day19】HTML5基础
一、兼容问题
支持Html5的浏览器包括Firefox(火狐浏览器),IE9及其更高版本,Chrome(谷歌浏览器),Safari,Opera等;国内的 遨游浏览器(Maxthon),以及基于IE或Chromium(Chrome的工程版或称实验版)所推出的360浏览器、搜狗浏览器、QQ浏览器、猎豹 浏览器等国产浏览器同样具备支持HTML5的能力。
二、语法
1.内容类型(ContentType)
HTML5的文件扩展符与内容类型保持不变,仍然为".html"或".htm"
2.DOCTYPE声明
不区分大小写
3.指定字符集编码
文章图片
4.可省略标记的元素
不允许写结束标记的元素:br、col、embed、hr、img、input、、link、meta
5.可以省略结束标记的元素
li、dt、dd、p、option、colgroup、thead、tbody、tfoot、tr、td、th
6.可以省略全部标记的元素:html、head、body、colgroup、tbody
7.属性值可以使用双引号,也可以使用单引号。
三、语义化结构标签
在HTML 5出来之前,我们用div来表示页面章节,但是这些div都没有实际意义。这些标签只是我们提供给浏览器的指令,只是定义一个网页的某些部分。但现在,那些之前没“意义”的标签因为因为html5的出现消失了,这就是我们平时说的“语义”。
section 更偏于划分区域。(网页的外围结构…更类似与div)
article 更偏向于内容的展示
aside 侧边栏(在一旁的)
header 网页头部或者是内容块头部
footer 网页的顶部或者内容快的底部
nav 导航区域。
figure 代表一个独立的区域
figcaption figure区域的标题
main 主体区域(IE不兼容)
hgroup 标题组
mark 高亮显示文本
time 用来处理时间
dialog 类似于对话框
四、HTML5多媒体标签
1.视频
文章图片
属性:autoplay 自动播放
controls 播放控件
loop 循环播放
muted 静音状态
poster 当视频没有加载或者没有播放的时候显示的封面图
2.音频
文章图片
属性: autoplay 自动播放
controls 播放控件
loop 循环播放
muted 静音状态
3.定义媒介资源
文章图片
type属性 -> 定义媒介类型
video里面 type属性的定义:video/ogg,video/mp4,video/webm
audio里面 type属性的定义:audio/ogg,audio/mpeg
五、H5新增表单内容
1.H5新增的type的类型
文章图片
2.H5新增的表单属性 max="" min=""