前端—每天5道面试题（1）

前端—每天5道面试题（1）

前端—每天5道面试题（1）

每天背5道前端面试题，希望我可以在远方的终点见到你

CSS模型简介:就是用来装页面上的元素的矩形区域。CSS 中的盒子模型包括IE 盒子模型和标准的W3C盒子模型。box-sizing(有3个值哦): border-box, padding-box, content-box.

标准盒子模型的盒子宽度:左右border+左右padding+width。IE盒子模型的盒子宽度: width在CSS3中引入了box -sizing属性，box-sizing: content-box;表示标准的盒子模型，box-sizing:border-box表示的是IE 盒子模型。最后，前面我们还提到了，box-sizing:padding -box,这个属性值的宽度包含了左右padd ing+width。也很好理解性记忆，包含什么，width 就从什么开始算起。

2、说一下link 标签和import标签的区别

link属于html标签，而@import 是css提供的页面被加载时，link 会同时被加载，而@ import引用的css会等到页面加载结束后再加载。link是html标签，因此没有兼容性，而@import 只有IE5以上才能识别。link方式样式的权重高于@import的。

3、谈谈transition 和animation的区别

Animation和transition大部分属性是相同的，他们都是随时间改变元素的属性值，他们的主要区别是transition需要触发一个事件才能改变属性，而animati on不需要触发任何事件的情况下才会随时间改变属性值，并且transition为2帧，从from…to，而animation可以一帧一帧的。

4、谈谈双边距重叠的问题(外边距折叠)

多个相邻( 兄弟或者父子关系)普通流的块元素垂直方向marigin会重叠。

折叠的结果为:

两个相邻的外边距都是正数时，折叠结果是它们两者之间较大的值。两个相邻的外边距都是负数时，折叠结果是两者绝对值的较大值。两个外边距一正一负时， 折叠结果是两者的相加的和。

5、如何实现图片在某个容器中居中的?

父元素固定宽高，利用定位及设置子元素margin值为自身的一半。父元素固定宽高，子元素设置position: absolute, margin: auto 平均分配margincss3属性transform.子元素设置position: absolute; left: 50%; top: 50%; transform: translate(-50%，-50%) ;即可。将父元素设置成display: table, 子元素设置为单元格display: table-cell。弹性布局display: flex. 设置align-i tems: center; justify-content: center。

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。