2020-12-18 JavaScript面试题1：浏览器的内核，盒模型，CSS3的新特性，CSS选择器及其优先级

js面试题

1.你做的页面在哪些浏览器测试过？这些浏览器的内核分别是什么?

IE: trident内核
Firefox：gecko内核
Safari:webkit内核
Opera:以前是presto内核，Opera现已改用Google Chrome的Blink内核
Chrome:基于webkit
只要能分清浏览器使用什么内核就得满分（safari和chrome使用webkit内核，Firefox使用gecko内核）

2.你简述盒模型

box-sizing:content-box（W3C盒模型，又名标准盒模型）：元素的宽高大小表现为内容的大小。 
box-sizing:border-box（IE盒模型，又名怪异盒模型）：元素的宽高表现为内容 + 内边距 + 边框的大小。背景会延伸到边框的外沿。

3.CSS3的新特性

word-wrap 文字换行
text-overflow 超过指定容器的边界时如何显示
text-decoration 文字渲染
text-shadow文字阴影
gradient渐变效果
transition过渡效果 transition-duration：过渡的持续时间
transform拉伸，压缩，旋转，偏移等变换
animation动画
transition和animation的区别： 

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

4.CSS选择器及其优先级

!important
内联样式style=""
ID选择器#id
类选择器/属性选择器/伪类选择器.class.active[href=""]
元素选择器/关系选择器/伪元素选择器html+div>span::after
通配符选择器*