1.你能描述当你制作一个网页的工作流程吗？
内容分析：分清展现在网络中内容的层次和逻辑关系
结构设计：写出合理的html结构代码
布局设计：使用html+css进行布局
样式设计：首先要使用reset.css
交互设计：鼠标特效
行为设计：js代码，ajax页面行为和从服务器获取数据
测试兼容性；优化性能。
2.假若你有5 个不同的样式文件(stylesheets), 整合进网站的最好方式是?
考虑重构CSS样式文件，已避免重复的css
3.你如何对网站的文件和资源进行优化？
首先我会试图减少静态文件和资源，比如使用css精灵（sprite），创建一个大的sprite图代替多张图片。然后可以考虑用svg图片代替png、jpg图片。也可以用css实现一些图片的重用，比如图片边框。
4.请说出三种减少页面加载时间的方法。(加载时间指感知的时间或者实际加载时间)
1 减少感知时间，添加一些视觉上的反馈，比如添加进度条等。
2 先导入静态文件
3 减少加载文件的数量，整合js文件称单一文件，整合css文件为单一文件，减少浏览器请求数量。
4 浏览的地方才加载
5.请解释CSS 动画和 JavaScript 动画的优缺点。
CSS3的动画的优点：
1.在性能上会稍微好一些，浏览器会对CSS3的动画做一些优化（比如专门新建一个图层用来跑动画）
2.代码相对简单
但其缺点也很明显：
1.在动画控制上不够灵活
2.兼容性不好
JavaScript的动画正好弥补了这两个缺点，控制能力很强，可以单帧的控制、变换，同时写得好完全可以兼容IE6，并且功能强大。
6.`doctype`(文档类型)的作用是什么？
DocType Declaration。此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范。
7.浏览器标准模式(standards mode) 、几乎标准模式（almoststandards mode）和怪异模式(quirks mode) 之间的区别是什么？
怪异模式：浏览器使用自己的方式解析渲染页面，在不同的浏览器会显示不同的样式。
标准模式：浏览器使用w3c的标准解析渲染页面
通过document.compatMode的值可以知道当前用的是什么模式，BackCompat：怪异模式，CSS1Compat：标准模式
8.HTML和XHTML 有什么区别？
HTML4.01里面有两大种规范，每大种规范里面又各有三种小规范，HTML4.01里面规定了普通、XHTML两大种规范。HTML觉得自己有些规定不严谨，比如标签是否可以使用大写字母，所以制定了XHTML，X代表严格的。
9.如果页面使用'application/xhtml+xml' 会有什么问题吗？
一些老的浏览器不支持,实际上,任何最新的浏览器都将支持application/xhtml+xml媒体类型。
10.如果网页内容需要支持多语言，你会怎么做？
使用utf-8这样的支持多种语言的编码。
11.在设计和开发多语言网站时，有哪些问题你必须要考虑？
字符编码，布局不同语言内容所需要的宽高
12.`data-` 属性的好处是什么？
绑定DOM强相关数据，js传递数据
13. HTML5 看作做一个开放平台，那它的构建模块有哪些？
<header>,<nav>,<main>,<section>,<article>,<aside>,<footer>
14. 请描述`cookies`、`sessionStorage`和 `localStorage` 的区别。
共同点：都是保存在浏览器端，且同源的。
区别：
1.cookie数据始终在同源的http请求中携带，即cookie在浏览器和服务器间来回传递。而sessionStorage和localStorage不会把数据发送给服务器，仅在本地保存。
2.cookie还有path的概念，可以限制cookie只属于某个路径下。
3.存储大小限制也不同，cookie数据不能超过4k。sessionStorage和localStorage可以达到5M或更多。
4.数据有效期不同，sessionStorage仅在当前浏览器窗口关闭前有效localStorage始终有效，窗口或浏览器关闭也一直保存。Cookie在设置的过期时间之前一直有效。
5.作用域不同，sessionStorage在不同的浏览器窗口间不能共享，即使是同一个页面。localStorage在所有同源窗口中都是共享的。Cookie也是同源窗口共享的。
15.请解释`<script>`、`<scriptasync>` 和`<script defer>` 的区别。
包含在script内部的js代码将被从上至下依次执行，页面的处理会停止。
async:表示应该立即下载脚本，但不妨碍页面中的其它操作。只对外部脚本文件有效。
defer：表示脚本可以延迟到文档完全被解析和显示之后再执行，只对外部脚本有效。不会影响页面的构造。
16.为什么通常推荐将CSS `<link>` 放置在`<head></head>` 之间，而将JS `<script>` 放置在`</body>` 之前？你知道有哪些例外吗？
在文档的<head>元素中包含的文件，意味着文件中代码都被下载，解析完之后，才能开始呈现页面的内容（浏览器在遇到<body>标签时才开始呈现内容）。页面的渲染需要在css文件下载完成后执行。Script放在<head>之间会导致呈现页面是出现明显的延迟，所以放在</body>之前。
17.CSS 中类(classes) 和ID 的区别。
css文件书写时，ID加前缀“#”，class用“.”。id在一个页面中只可以使用1次，class可以被多次引用。
18. 请问"resetting" 和"normalizing" CSS 之间的区别？你会如何选择，为什么？
都是为了解决不同浏览器一些默认样式的不同
Reset重置所有样式，normalize只做适当重置
19.请解释浮动(Floats) 及其工作原理
通过float：left或float：right，可以将指定元素浮动到左侧或右侧。
浮动的元素脱离标准流。行内元素浮动后可以设置宽和高。如果父元素只有浮动的子元素，那么父元素高为0
浮动的元素会相互贴靠，这会导致一些问题，需要清楚浮动。
浮动元素的字围效果。
20.描述`z-index`和叠加上下文是如何形成的。
处理的是z轴上元素重叠显示哪个的问题。
z-index值表示谁压着谁。数值大的压着小的，z-index没有单位，默认为0.
只有定位了得元素才能有z-index值。
值相同，写在后面的压住别人。
从父现象。
21.列举不同的清除浮动的技巧，并指出它们各自适用的使用场景。
1.给浮动的元素的祖先元素加高。
2.隔墙法：两个盒子之间加一个具有clear：both的盒子。
3．内墙法：使用伪元素，::after,::before，里面加clear：both
4.父盒子加overflow:hidden
22.请解释CSS sprites，以及你要如何在页面或网站中实现它。
Css sprite 是一种css图像合并技术，该方法是将小图标和背景图像合并到一张图片上，然后利用css的背景定位来显示需要显示的图片部分。优点就是减少了http请求。借助fireworks工具，找到x和y的值，然后，background-position: –x -y;
23.你最喜欢的图片替换方法是什么，你如何选择使用。
1.text-indent一个非常大的负值。
2.外盒子放文本，position:relative,内盒子放图片position:absolute;width:100%;height:100%;
24.你会如何解决特定浏览器的样式问题？
统一默认样式，margin，padding等。-webkit-等前缀写法。
25.如何为有功能限制的浏览器提供网页？
26.有哪些的隐藏内容的方法(如果同时还要保证屏幕阅读器可用呢)？
和23题类似吧。details和summary
27.请解释浏览器是如何判断元素是否匹配某个CSS 选择器？
浏览器先产生一个元素集合，这个集合往往由最后一个部分的索引产生。然后向上匹配，如果不符合上一个部分，就把元素从集合中删除，直到整个选择器都匹配完。
body.ready #wrapper > .lol233
先把所有 class 中有 lol233 的元素拿出来组成一个集合，然后上一层，对每一个集合中的元素，如果元素的 parent id 不为 #wrapper 则把元素从集合中删去。 再向上，从这个元素的父元素开始向上找，没有找到一个 tagName 为 body 且 class 中有 ready 的元素，就把原来的元素从集合中删去。
至此这个选择器匹配结束，所有还在集合中的元素满足。
28.请描述伪元素(pseudo-elements) 及其用途。
CSS伪元素用于向某些选择器设置特殊效果。清除浮动。
29.请解释你对盒模型的理解，以及如何在CSS 中告诉浏览器使用不同的盒模型来渲染你的布局。
30.请解释```* { box-sizing: border-box; }``` 的作用,并且说明使用它有什么好处？
31.请罗列出你所知道的display 属性的全部值
32.请解释inline 和inline-block 的区别？
33.请解释relative、fixed、absolute 和 static 元素的区别
相对定位就是微调元素的位置。让元素相对于自己原来的位置，进行位置调整。不脱离标准流。
绝对定位脱离标准流，不需要display:block就可以设置宽高了。
绝对定位的参考点，如果用top描述，那么定位参考点就是页面的左上角，而不是浏览器的左上角。
如果用bottom描述，那么就是浏览器首屏窗口尺寸，对应的页面的左下角。
一个绝对定位的元素，如果父辈元素中出现了也定位了的元素，那么将以父辈这个元素，为参考点。
固定定位，就是相对浏览器窗口定位。页面如何滚动，这个盒子显示的位置不变。固定定位脱标！
34.CSS 中字母'C' 的意思是叠层 (Cascading)。请问在确定样式的过程中优先级是如何决定的(请举例)？如何有效使用此系统？
1） 先看有没有选中，如果选中了，那么以（id数，类数，标签数）来计权重。谁大听谁的。如果都一样，听后写的为准。
2） 如果没有选中，那么权重是0。如果大家都是0，就近原则。
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
