HTML面试题记录

取自：https://github.com/yangshun/tech-interview-handbook/blob/master/front-end/interview-questions.md

以下问题仅仅用于抽查助记。

1. doctype的意义？

2. HTML和XHTML有什么区别？

3. 如何提供包含多种语言内容的页面？

4. 在设计多语言的网站时，要注意些什么？

5. data-属性有什么作用？

6. HTML5有些什么改进？

7. cookie, sessionStorage, localStorage 有什么区别？

8. script, script async, script defer 有什么不同？

9. 为什么在标签中使用srcset属性？请描述浏览器遇到该属性后的处理过程。

10. 什么是渐进式渲染？

CSS

1. CSS 选择器的优先级是如何计算的？

2. 重置（resetting）CSS 和 标准化（normalizing）CSS 的区别是什么？你会选择哪种方式，为什么？

3. id和class在css中有什么不同？

4. 描述float并且它是怎么工作的？

5. 描述z-index并且它是怎么进行叠加的？

6. 有哪些清除浮动的技术，都适用哪些情况？

7. 请解释什么是雪碧图（css sprites），以及如何实现？

8. 如何解决不同浏览器的样式兼容性问题？

9. 如何为功能受限的浏览器提供页面？ 使用什么样的技术和流程？

10. 有什么不同的方式可以隐藏内容（使其仅适用于屏幕阅读器）？

11. 你使用过栅格系统吗？偏爱哪一个？

12. 你是否使用过媒体查询或移动优先的布局？

13. 你熟悉制作 SVG 吗？

14. 除了screen，你还能说出一个 @media 属性的例子吗？

15. 编写高效的 CSS 应该注意什么？

16. 使用 CSS 预处理的优缺点分别是什么？

17. 对于你使用过的 CSS 预处理，说说喜欢和不喜欢的地方？

18. 解释浏览器如何确定哪些元素与 CSS 选择器匹配。

19. 描述伪元素及其用途。

20. 说说你对盒模型的理解，以及如何告知浏览器使用不同的盒模型渲染布局。

21. • { box-sizing: border-box; }会产生怎样的效果？

22. display的属性值都有哪些？

23. inline和inline-block有什么区别？

24. relative、fixed、absolute和static四种定位有什么区别？

25. 你使用过哪些现有的 CSS 框架？你是如何改进它们的？

26. 你了解 CSS Flexbox 和 Grid 吗？

27. 请解释在编写网站时，响应式与移动优先的区别。

28. 响应式设计与自适应设计有何不同？

29. 什么情况下，用translate()而不用绝对定位？什么时候，情况相反。