H5+C3+浏览器高频率面试题

一、html5和html的区别

1.html5新增了语义化标签：Header页面头部 main页面主要内容 footer页面底部
2.html5完全支持css3
3.支持本地离线存储
4.新增了canvas标签
5.新增视频和音频标签

二、Css3新增的特性

边框：
border-radios 添加圆角边框

border-shadow：给框添加阴影 （水平位移，垂直位移，模糊半径，阴影尺寸，阴影颜色，insetr（内/外部阴影））

border-image：设置边框图像

border-image-source 边框图片的路径

border-image-slice 图片边框向内偏移

border-image-width 图片边框的宽度

border-image-outset 边框图像区域超出边框的量

border-image-repeat 图像边框是否平铺（repeat平铺 round铺满 stretch 拉伸）

背景：

Background-size 背景图片尺寸

Background-origin规定background-position属性相对于什么位置定位

渐变：

Linear-gradient（）线性渐变

Radial-gradient（）径向渐变

2D转换方法：

rotate旋转 translate（x，y）指定元素在二维空间的位移 scale（n）定义缩放转换

3D转换方法：

Perspective（n）为3D转换 translate rotate scale

三、清除浮动的方式有哪些？说出各自的优点

方式一:使用overflow属性来清除浮动

.ovh{
   
   
	overflow:hidden;
}

先找到浮动盒子的父元素，再在父元素中添加一个属性：overflow:hidden,就是清除这个父元素中的子元素浮动对页面的影响.
注意：一般情况下也不会使用这种方式，因为overflow:hidden有一个特点，离开了这个元素所在的区域以后会被隐藏（overflow:hidden会将超出的部分隐藏起来）.

方式二:使用额外标签法

.clear{
   
   
　　clear:both;
}

在浮动的盒子之下再放一个标签，在这个标签中使用clear:both，来清除浮动对页面的影响.
a.内部标签：会将这个浮动盒子的父盒子高度重新撑开.
b.外部标签：会将这个浮动盒子的影响清除，但是不会撑开父盒子.
注意：一般情况下不会使用这一种方式来清除浮动。因为这种清除浮动的方式会增加页面的标签，造成结构的混乱

方法三:使用伪元素来清除浮动

.clearfix:after{
   
   
    content:"";//设置内容为空
    height:0;//高度为0
    line-height:0