css部分

1. 请列举几种可以清除浮动的方法（至少两种）

采用伪类:after进行后续空制的高度位零的伪类层清除

采用css overflow:auto的方式撑高

采用css overflow:hidden的方式产生怪异适应

采用display:table将对象变成table形式

采用div标签，以及css的clear属性

采用br标签，以及其自身html的clear属性

2. img下的留白。

解决方案：给img设定 display:block。

3. CSS选择符有哪些？哪些属性可以继承？优先级算法如何计算？内联和important哪个优先级高？

1.标签选择器

html元素名{}

2.ID选择器

#ID名{}

3.CLASS选择器

.class名{}

可以继承的有：font-size font-family colo...

优先级算法用id>class>标签

!important 的优先级最高。

4. 请说明setTimeout与setInterval的区别？

setTimeout只加载一次，setInterval每隔指定的时间就执行一次表达式

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

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

6. xhtml和html有什么区别

HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言

最主要的不同：

XHTML 元素必须被正确地嵌套。

XHTML 元素必须被关闭。

标签名必须用小写字母。

XHTML 文档必须拥有根元素

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

用于声明文档使用那种规范（html/Xhtml）一般为 严格 过度 基于框架的html文档

加入XMl声明可触发，解析方式更改为IE5.5 拥有IE5.5的bug

8. 行内元素有哪些?块级元素有哪些?CSS的盒模型?

块级元素：div p h1 h2 h3 h4 form ul

行内元素: a b br i span input select

Css盒模型:内容，border ,margin，padding

9. CSS引入的方式有哪些? link和@import的区别是?

内联 内嵌 外链 导入

区别 ：同时加载

前者无兼容性，后者CSS2.1以下浏览器不支持

Link 支持使用javascript改变样式，后者不可

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

结构层 Html 表示层 CSS 行为层 js

11. 你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么?

Ie(Ie内核) 火狐（Gecko） 谷歌（webkit） opear(Presto)

12. 写出几种IE6 BUG的解决方法

1.双边距BUG float引起的 使用display

2.3像素问题 使用float引起的 使用dislpay:inline -3px

3.超链接hover 点击后失效 使用正确的书写顺序 link visited hover active

4.Ie z-index问题 给父级添加position:relative

5.Png 透明 使用js代码 改

6.Min-height 最小高度 ！Important 解决’

7.select 在ie6下遮盖 使用iframe嵌套

8.为什么没有办法定义1px左右的宽度容器（IE6默认的行高造成的，使用over:hidden,zoom:0.08 line-height:1px）

13. 标签上title与alt属性的区别是什么?

Alt 当图片不显示是 用文字代表。

Title 为该属性提供信息

14. 描述css reset的作用和用途。

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

15. 解释css sprites，如何使用

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

16. 浏览器标准模式和怪异模式之间的区别是什么?

盒子模型 渲染模式的不同

使用 window.top.document.compatMode 可显示为什么模式

17. 你如何对网站的文件和资源进行优化?期待的解决方案包括：

文件合并

文件最小化/文件压缩

使用CDN托管

缓存的使用

18. 什么是语义化的HTML?

直观的认识标签 对于搜索引擎的抓取有好处

19. css盒模型

浏览器布局的基本元素是盒，在w3c的标准模式下，width=width，但是在怪异模式下，width=border*2+padding*2+width;其中后代元素的width：100%；参照的是右边的那个width，

box-sizing: content-box|border-box|inherit;

20. html5的新特性

1、标签语义化，比如header，footer，nav，aside，article，section等，新增了很多表单元素，入email，url等，除去了center等样式标签，还有除去了有性能问题的frame，frameset等标签

2、音视频元素，video，audio的增加使得我们不需要在依赖外部的插件就可以往网页中加入音视频元素。

3、新增很多api，比如获取用户地理位置的window.navigator.geoloaction，

4、websocket

websocket是一种协议，可以让我们建立客户端到服务器端的全双工通信，这就意味着服务器端可以主动推送数据到客户端，

5、webstorage，webstorage是本地存储，存储在客户端，包括localeStorage和sessionStorage，localeStorage是持久化存储在客户端，只要用户不主动删除，就不会消失，sessionStorage也是存储在客户端，但是他的存在时间是一个回话，一旦浏览器的关于该回话的页面关闭了，sessionStorage就消失了，

6、缓存

html5允许我们自己控制哪些文件需要缓存，哪些不需要，具体的做法如下：

1、首先给html添加manifest属性，并赋值为cache.manifest

2、cache.manifest的内容为:

CACHE MANIFEST

#v1.2

CACHE : //表示需要缓存的文件

a.js

b.js

NETWORK: //表示只在用户在线的时候才需要的文件，不会缓存

c.js

FALLBACK

/ /index.html //表示如果找不到第一个资源就用第二个资源代替

7、web worker，web worker是运行在浏览器后台的js程序，他不影响主程序的运行，是另开的一个js线程，可以用这个线程执行复杂的数据操作，然后把操作结果通过postMessage传递给主线程，这样在进行复杂且耗时的操作时就不会阻塞主线程了。

21. 对html5的语义话的理解

html5的语义化指的是用正确的标签包含正确的内容，比如nav标签，里面就应该包含导航条的内容，而不是用做其他的用途，标签语义化的好处就是结构良好，便于阅读，方便威化，也有利于爬虫的查找，提高搜索率。

22. 浏览器的渲染过程

1) 处理HTML标签建立DOM树

2) 处理CSS标签建立CSSOM树

3) 连接CSSOM树和DOM树形成一个render（渲染）树

4) 在render树上运行布局来计算每个节点的形状

5) 在屏幕上画每一个节点

23. 重构、回流

浏览器的重构指的是改变每个元素外观时所触发的浏览器行为，比如颜色，背景等样式发生了改变而进行的重新构造新外观的过程。重构不会引发页面的重新布局，不一定伴随着回流，

回流指的是浏览器为了重新渲染页面的需要而进行的重新计算元素的几何大小和位置的，他的开销是非常大的，回流可以理解为渲染树需要重新进行计算，一般最好触发元素的重构，避免元素的回流；比如通过通过添加类来添加css样式，而不是直接在DOM上设置，当需要操作某一块元素时候，最好使其脱离文档流，这样就不会引起回流了，比如设置position：absolute或者fixed，或者display：none，等操作结束后在显示