我的百度2015校招前端一面，泪...

（未完待续）

废话不说，过场之后再补充。

以下是问题的大概意思，对应的回答是我事后回顾的答案，可能还有错误。唉～面试时我的回答偏离太远了……

第一个问题：说一下position属性的几个值，以及之间的区别？

回答：

position属性的值有：

• static，默认值。元素在文档流中正常排列，top、right、bottom、left以及z-index属性无效，都认为是0；
• relative，相对定位。元素按照本应在文档流的位置来定位，虽脱离文档流但仍然会占着位置；
• absolute，绝对定位。向上寻找第一个position为非static的元素，作为定位基准；
• fixed，固定布局。以可见的视口左上角进行定位。

第二个问题，画一下盒模型；元素实际的宽度是怎么决定的？如果设置了父元素width: 100px; padding: 10px，子元素width: 100%，结果是怎样的？

回答：

图就不画了。

通常，元素的宽度 = width + padding + border。不过CSS3中有一个新属性box-sizing: content-box | border-box | inherit;

• content-box，即CSS2.1的样式，默认为该值；
• border-box，设置的width就是元素的实际宽度，而内容部分的宽度 = width - border - padding。
• inherit，继承父元素的值

所以之后假设的情况，如果box-sizing: border-box，则内容部分宽度会自动缩减；否则，子元素会顶出父元素。

第三个问题，水平3列布局，左右两列固定为100px宽，中间要求自适应。写出css代码。

回答：

写了个页面，-->戳<-- 还可以戳-->这儿<--，简单粗暴好理解，不过跟我用的不太一样，都有效，应该是因为现在规范还没有确定吧

第四个问题，用JS写一个遍历DOM的函数

回答：

第五个问题，实现函数once(func)，参数func是一个函数。使func只执行一次，之后的调用直接返回第一次调用得到的值。

第六个问题，在一个元素内，有很多的卡片，卡片会增加、减少。说出一个绑定事件的方案，使点击卡片时触发事件。如果每个卡片内还有一些子元素，如何判断的确是从卡片触发的事件，而不是卡片中的子元素？