平常前端面试题

1. rem单位如何转换为像素值,是否全部的IE版本都支持

答:取决于页根元素的字体大小,即html元素的字体大小,所得的像素值=根元素html font-size(默认是16)*rem值,例如,根元素的字体大小16px,10rem将等同于160px,即10 x 16 = 160。除了IE8及更早版本外,全部浏览器均已支持rem。javascript

2. 什么是外边距重叠margin-collapse?俩个相邻的外边距都是正数,负数或一正一负时的结果是什么?

在CSS当中,相邻的两个盒子(多是兄弟关系也多是祖先关系)的外边距能够结合成一个单独的外边距。这种合并外边距的方式被称为折叠,而且于是所结合成的外边距称为折叠外边距。css

折叠结果遵循下列计算规则:html

两个相邻的外边距都是正数时,折叠结果是它们二者之间较大的值。java

两个相邻的外边距都是负数时,折叠结果是二者绝对值的较大值。web

两个外边距一正一负时,折叠结果是二者的相加的和。浏览器

3. 如何在编写css的时候就尽可能避免渲染计算

1.dom深度尽可能浅。dom

2.减小inline javascript、css的数量。ide

3.使用现代合法的css属性。性能

4.不要为id选择器指定类名或是标签,由于id能够惟一肯定一个元素。测试

5.不要给类选择器指定标签,类,表明具备一类属性的标签,不只是一个,虽然能够实现,可是下降了效率。

6.避免后代选择符,尽可能使用子选择符。缘由:子元素匹配符的几率要大于后代元素匹配符。后代选择符;#tp p{} 子选择符:#tp>p{}

7.避免使用通配符,举一个例子,.mod .hd *{font-size:14px;} 根据匹配顺序,将首先匹配通配符,也就是说先匹配出通配符,而后匹配.hd(就是要对dom树上的全部节点进行遍历他的父级元素),而后匹配.mod,这样的性能耗费可想而知)

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

a、 IE(IE浏览器) : trident 内核    -ms-

b、 Firefox(火狐浏览器) : gecko 内核     -moz-

c、 Safari(苹果浏览器) :webkit 内核      -webkit-

d、 Opera(欧朋浏览器):之前是 presto 内核, Opera 现已改用 Google Chrome 的 Blink 内核     -o-

e、 Chrome(谷歌浏览器):Blink(基于 webkit , Google 与 Opera Software 共同开发 )      -webkit-

5. === 和 == 的区别

== 表示相等 (值相等)

===表示恒等(类型和值都要相等)

js在比较的时候若是是 == 会先作类型转换,再判断值得大小,若是是===类型和值必须都相等。

相关文章
相关标签/搜索