html5+css3一些大厂的面试题目（个人回答：如果有更好的回答欢迎评论）

1.css3盒子模型怎么回答？
标准盒子模型：box-sizing ，content-box
，ie盒子模型(怪异盒子模型)
其实我最常用的就是标准盒子模型，我们写的width和height是表示内容区域到宽度和高度，盒子的宽高是boder+width（height）+padding所组成的，但是一般在工作中我们想指定一个盒子的宽高为100，如果这时候用标准盒子模的话盒子就会撑开，这里我用到怪异盒子模型（box-sizing:border-box），因为怪异盒子模型设置的宽高就是整个盒子的大小，不论你怎么改border和padding它永远是100*100的宽高
2.掌握几大经典布局的方案？
圣杯布局
双飞翼布局
=》左右固定中间自适应
flex布局
定位布局
在项目中的话，如果是不考虑兼容性的话我更喜欢用flex布局去做，如果是考虑兼容性的话可能会选择定位去做。这些实现的原理基本上都是自适应，两边固定的写法。在做新闻项目的时候，一般是标题这边的内容自适应，左边的图片固定住。

3.移动端响应式布局开发3大方案
媒体查询（media），rem布局，flex布局，vh/vw布局
媒体查询（media）一般都是pc端和移动端一套网页的话就使用这种媒体查询的方法来制作，不过代码太过于沉余，开发起来难度较大，比较适用于开发小型的网站。
rem布局：只适用于移动端的使用，通过固定根标签的font-size的大小，其它元素使用rem单位设置成相应的百分比
flex布局：部分会使用flex布局来制作，替代了float的作用，不需要清除浮动的，这些麻烦的操作。
vh/vw:根百分比布局有点相识
所有的移动端的大型的项目一般都需要靠媒体查询和rem的配合使用!
4.让盒子水平垂直居中的方法？
1.定位
在有固定宽高的时候可以给父盒子设置相对定位，给子盒设置绝对定位，top和left各为50%，在使用margin-top：-盒子高度的一半；margin-left：-盒子宽度的一半；
在不固定确定宽高的时候回，也可以使用定位来做，给父盒子设置相对定位，给子盒设置绝对定位，
top和left各为50%，在使用css3里面的tranition:transale(-50%,-50%)
2.使用flex布局制作
给父盒子设置display：flex；然后设置主轴居中，还有交叉轴居中就可以实现了
3.使用js实现居中
先获取父盒子的宽高，在获取子盒子的宽高，在用父盒子的宽高减去子盒子的宽高/2就可以实现居中
4.使用display:table-cil
这个基本使用不到，需要父盒子有具体的宽高，这个属性是用来设置文本居中的，可以吧子盒子设置成行内块，在给这个子盒子设置vertical-align:middle; text-align:center 就可以实现。（父盒子是100%也不行，一定是要固定宽高）
5.使用css，让一个div消失在视野中？
给这个div设置透明度为0，display：none,如果给div设置的是透明度和visibility: hidden;，background-color:transparent，transform: scale(0);的话，这个元素虽然看不见了，但是还是会占用位置，给div设置display：none的话元素会直接被隐藏，还会触发页面的重构重绘。
6.请说明z-index的工作原理，适用的范围？
z-index这个属性一定要设置在有除了static定位属性的身上才会起到效果，设置的值越大，就会越靠上显示，当这个元素没有定义是时候会后来者居上，这时候设置z-index可以让底下的元素靠上显示。（需要脱离文档流才能使用）。实现范围：遮罩层，导航栏浮动顶值等！
（ 一般的布局会受父元素的限制, 如果父元素比较低, 那么子元素怎么设都被盖住）
7.谈谈你对html5的理解？
1.语义化标签nav，header，footer，menu等，在之前的没有添加这些语义化标签的时候一般在开发的时，我们都会给class设置一个语义化的单词，现在有了语义化标签了，在我们合作开发项目的时候，别人再看我们的html结构就清楚我们这部分大致写的是什么内容，有利于团队开发的合作以及维护，也有利于搜索引擎以及爬虫的对于关键词的权重，利于seo
2.新增加了表单元素type:（url，number，email，date，time），属性（placeholder， autofocus，required），让我们对于操作表单更便捷，提升了我们的开发效率！
3.新增了一些音频的标签
4.新增了本地储存操作

1. localStorage: 没有时间限制的数据存储
2. sessionStorage: 针对一个session的数据存储
   8.如何使一个div里面的文字垂直居中，且该文字的大小根据屏幕自适应？
   1.可以给元素设置行高和text-align：center,或者设置display：flex；主轴侧轴居中，或者使用定位也是可以实现的，文字大小自适应的话需要使用到媒体查询与 rem的配合使用，在给这个元素设置font-size使用rem单位就ok了
   9.不考虑其他因素，下面哪种的渲染性能比较高？
   .box a{…}
   a{…}
   第二种会比第一种的渲染的程度高，因为css渲染的时候先找到啊所有的a，在去找的这个box下面的a在进行渲染，是从右往左开始渲染