刚好我在github看到一篇很全的前端开发面试题目，所以就尝试自己整理一份答案出来。这篇文章的初衷是希望能够和大家互相讨论交流一下，如果我有错误的地方十分欢迎指出来。
PS: 我不认为单纯通过做题能够成为一名优秀的开发者，但是如果因为没有准备充足错失去机会是一件更糟糕的事（有这种经验的人会认同我的）。
CSS相关问题
1. class和id的区别
如果元素具有唯一性，就考虑使用id；如果元素会多次出现，就是用class。值得注意的是，id的优先级比class高。
"CSS doesn't care,But Javascript care"
如果id和class用的不恰当，在JavaScript中就会遇到问题。例如getElementById返回一个对象，而getElementByClassName就会返回一个数组。
2. 描述下"reset"CSS文件的作用和使用它的好处
每个浏览器对于不同元素的css样式的默认值是不一样的，使用reset可以统一css样式。
常见的reset方法有：
* { margin: 0; padding: 0;} 期待能够指出它的负面影响，或者提到它的一个替代者normalize
使用reset方法会有个很大弊端，因为它清除了所有元素的margin和padding。实际上，对于某些元素保留一定的padding和margin是有好处的。
normalize是一个比较理想的解决方案。它统一了css的默认样式，同时对相应的元素初始化了默认值。一些比较流行的库例如bootstrap已经事先引入了normalize。
3. 解释一下浮动和它的工作原理
浮动的工作原理：如果对一个元素设置浮动，它就会脱离文本流直到碰到框的最左或者最右，普通流的其他元素会取代它原本的位置。值得注意的是，如果框太窄不足容纳多个浮动元素，多出来的浮动的元素会出现在下一行；如果先前的元素高出其他浮动元素，可能导致下一行的浮动元素被"卡住"，接触不到下一行的边框。
4. 描述z-index和叠加上下文是如何形成的
z-index属性设置元素的堆叠顺序，数值越大的越靠前。注意，z-index的值可以是负数，并且只在元素设置定位(比如position:absolute)才可形成。
点击查看CodePen示例
顺便加一句，firefox为web开发者增添了3D视图的功能。pretty neat, huh?
5. 列举不同的清除浮动的技巧，并指出它们各自适应的场景
元素溢出浮动会出现一个问题，由于浮动的元素脱离了文本流，如果框的高度不足以包含浮动元素，浮动的元素就会"溢出"。清除浮动元素溢出的方法 设置空标签：
在框内设置一个空标签
查看更多关于前端开发面试题（一）_html/css_WEB-ITnose的详细内容...