前端必须知道的几点

1.BFC（块级格式化上下文），一个创建了新的 BFC 的盒子是独立布局的，盒子内元素的布局

不会影响盒子外面的元素。在同一个 BFC 中的两个相邻的盒子在垂直方向发生 margin 重叠

的问题。

 

2.html 语义化是什么？

 

当页面样式加载失败的时候能够让页面呈现出清晰的结构

 

有利于 seo 优化，利于被搜索引擎收录（更便于搜索引擎的爬虫程序来识别）

 

便于项目的开发及维护，使 html 代码更具有可读性，便于其他设备解析。

 

3、Doctype 的作用？严格模式与混杂模式的区别？

<!DOCTYPE>用于告知浏览器该以何种模式来渲染文档

严格模式下：页面排版及 JS 解析是以该浏览器支持的最高标准来执行

混杂模式：不严格按照标准执行，主要用来兼容旧的浏览器，向后兼容。

 

4、IE 的双边距 BUG：块级元素 float 后设置横向 margin，ie6 显示的 margin

比设置的较大。解决：加入_display：inline。

 

5、HTML 与 XHTML——二者有什么区别？

1. 所有的标记都必须要有一个相应的结束标记。

 

2. 所有标签的元素和属性的名字都必须使用小写。

 

3. 所有的 XML 标记都必须合理嵌套。

 

4. 所有的属性必须用引号 "" 括起来。

 

5. 把所有 < 和 & 特殊符号用编码表示。

 

6. 给所有属性赋一个值。

 

7. 不要在注释内容中使用 "--"。

 

8. 图片必须有说明文字。

 

6、html 常见兼容性问题？。

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）

 

9.IE5-8 不支持 opacity，解决办法：

.opacity {

opacity: 0.4

　　　　 filter: alpha(opacity=60); /* for IE5-7 */

　　　　 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)"; /* for IE

　　　　　8*/}

 

10. IE6 不支持 PNG 透明背景，解决办法: IE6 下使用 gif 图片