HTML5和CSS3提高

HTML5

语义化标签

<header>：头部标签<nav>：导航标签<article>：内容标签<section>：定义文档内的某个区域<aside>：侧边栏标签<footer>：尾部标签

多媒体标签

视频 <video>

<video src = "文件地址" controls = "controls" ></video>

音频 <audio>

<audio src = "文件地址" controls = "controls"></audio>

input 类型 表单属性

CSS3

选择器

属性选择器 结构伪类选择器 nth-child(n)： 选择父元素的一个或多个特定的子元素

n可以是数字，选择第n个子元素n可以是关键字，even偶数，odd奇数n可以是公式，n从0开始计算，第0个元素或者超出元素的个数会被忽略

nth-child(n) 和 nth-of-type(n) 的区别：

nth-child: 会把所有的子元素都排列序号，执行时先找第n个子元素，然后再看是否和E匹配nth-of-type: 会把指定的子元素给排列顺序，执行时先去匹配E，然后再根据去找第n个子元素

伪元素选择器 伪元素字体图标： 伪元素清除浮动：

盒子模型 border-box

css3中可以通过 border-sizing 来设置盒子模型，2个值：content-box（默认） 和 border-box 。

滤镜filter

filter: 函数();

calc 函数

width: calc(100% - 80px); //括号内进行 +、-、*、/ 运算

过渡