1.对 WEB 标准以及 W3C 的理解与认识？ 

　　参考： 标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外 链 css 和 js 脚本、 结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更 广泛的设备所访问、更少的代码和组件，容易维 护、改版方便，不需要变动页面内容、提 供打印版本而不需要复制内容、提高网站易用性。 

2.xhtml 和 html 有什么区别？

　　参考： HTML 是一种基本的 WEB 网页设计语言，XHTML 是一个基于 XML 的置标语言。 最主要的不同： XHTML 元素必须被正确地嵌套。 XHTML 元素必须被关闭。 标签名必须用小写字母。 XHTML 文档必须拥有根元素。

3.Doctype? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义? 

　　参考： 用于声明文档使用那种规范（html/Xhtml）一般为 严格 过度 基于框架的 html 文档。 加入 XMl 声明可触发，解析方式更改为 IE5.5 拥有 IE5.5 的 bug。 

4.描述 css reset 的作用和用途。？

　　参考： Reset 重置浏览器的 css 默认属性 浏览器的品种不同，样式不同，然后重置，让他们统 一。 

5.解释 css sprites，如何使用。？

　　参考： Css 精灵 把一堆小的图片整合到一张大的图片上，减轻服务器对图片的请求数量。 

6.你如何对网站的文件和资源进行优化?

　　参考：解决方案包括：文件合并、文件最小化/文件压缩、使用 CDN 托管、缓存的使用

7.清除浮动的几种方式，各自的优缺点？

　　参考：1.使用空标签清除浮动 clear:both（理论上能清楚任何标签，，，增加无意义的标签） 。 2.使用 overflow:auto（空标签元素清除浮动而不得不增加无意代码的弊端,,使用 zoom:1 用于兼容 IE）。 3.是用 afert 伪元素清除浮动(用于非 IE 浏览器)。 

8.前端页面由哪三层构成，分别是什么?作用是什么? 

　　参考： 网页分成三个层次，即：结构层、表示层、行为层。

　　　　　网页的结构层（structural layer）由 HTML 或 XHTML 之类的标记语言负责创建。标签， 也就是那些出现在尖括号里的单词，对网页内容的语义含义做出了描述，但这些标签不包含 任何关于如何显示有关内容的信息。例如， P 标签表达了这样一种语义：“这是一个文本段”。

　　　　 网页的表示层（presentation layer） 由 CSS 负责创建。 CSS 对“如何显示有关内容” 的问题做出了回答。

　　　　网页的行为层（behavior layer）负责回答“内容应该如何对事件做出反应”这一问题。这是 Javascript 语言和 DOM 主宰的领域。

9.浏览器的内核分别是什么? 

　　参考：  IE 浏览器的内核 Trident、Mozilla 的 Gecko、Chrome 的 Blink（WebKit 的分支）、Opera 内核原为 Presto，现为 Blink。 

10.常见兼容性问题？　

　　参考： * png24 位的图片在 iE6 浏览器上出现背景，解决方案是做成 PNG8. * 浏览器默认的margin和padding不同。解决方案是加一个全局的*{margin:0;padding:0;} 来统一。
　　　　　* IE6 双边距 bug:块属性标签 float 后，又有横行的 margin 情况下，在 ie6 显示 margin 比设置的大。 浮动 ie 产生的双倍距离 #box{ float:left; width:10px; margin:0 0 0 100px;} 这种情况之下 IE 会产生 20px 的距离，解决方案是在 float 的标签样式控制中加入 —— _display:inline;将其转化为行内属性。(_这个符号只有 ie6 会识别) 渐进识别的方式，从总体中逐渐排除局部。

　　　　　　首先，巧妙的使用“9”这一标记，将 IE 游览器从所有情况中分离出来。 接着，再次使用“+”将 IE8 和 IE7、IE6 分离开来，这样 IE8 已经独立识别。

　　　　　　.bb{ background-color:#f1ee18;       /*所有识别*/

　　　　　  　　 .background-color:#00deff9;     /*IE6、7、8 识别*/

　　　　　　　   +background-color:#a200ff;/*IE6、7 识别*/

　　　　　　　　 _background-color:#1e0bd1;/*IE6 识别*/

　　　　　　 }

　　　　* IE 下,可以使用获取常规属性的方法来获取自定义属性, 也可以使用 getAttribute()获取自定义属性; Firefox 下,只能使用 getAttribute()获取自定义属性. 解决方法:统一通过 getAttribute()获取自定义属性.

　　　　* IE 下,even 对象有 x,y 属性,但是没有 pageX,pageY 属性; Firefox 下,event 对象有 pageX,pageY 属性,但是没有 x,y 属性. * 解决方法：（条件注释）缺点是在 IE 浏览器下可能会增加额外的 HTTP 请求数。

　　　　 * Chrome 中文界面下默认会将小于 12px 的文本强制按照 12px 显示, 可通过加入 CSS 属性 -webkit-text-size-adjust: none; 解决.

　　　　　超链接访问过后 hover 样式就不出现了 被点击访问过的超链接样式不在具有 hover 和 active 了解决方法是改变 CSS 属性的排列顺序:

　　　　　　　　 L-V-H-A : a:link {} a:visited {} a:hover {} a:active {}

11.html5 有哪些新特性、移除了那些元素？如何处理 HTML5 新标签的浏览器兼容问题？如 何区分 HTML 和 HTML5？ 　

　　参考： * HTML5 现在已经不是 SGML 的子集，主要是关于图像，位置，存储，多任务等功能 的增加。

　　　　　* 绘画 canvas

　　　　　用于媒介回放的 video 和 audio 元素

　　　　　本地离线存储 localStorage 长期存储数据，浏览器关闭后数据不丢失；

　　　　　sessionStorage 的数据在浏览器关闭后自动删除 语意化更好的内容元素，比如 article、footer、header、nav、section 表单控件，calendar、date、time、email、url、search
　　　　   新的技术 webworker, websockt, Geolocation

　　　　　　* 移除的元素 纯表现的元素：basefont，big，center，font, s，strike，tt，u；

　　　　　对可用性产生负面影响的元素：frame，frameset，noframes；

　　　　   支持 HTML5 新标签：

　　　　　　* IE8/IE7/IE6 支持通过 document.createElement 方法产生的标签， 可以利用这一特性让这些浏览器支持 HTML5 新标签，

　　　　   浏览器支持新标签后，还需要添加标签默认的样式：

　　　　　　* 当然最好的方式是直接使用成熟的框架、使用最多的是 html5shim 框架

　　　　   如何区分： DOCTYPE 声明新增的结构元素功能元素

12. 解释下浮动和它的工作原理？清除浮动的技巧？

　　参考：浮动元素脱离文档流，不占据空间。浮动元素碰到包含它的边框或者浮动元素的边框停留。