总结HTML和CSS易忘点

日日行,不怕千万里;常常做,不怕千万事

一、HTML

1、HTML常见兼容性问题？

1、双边距BUG float引起的，解决方案使用display。
2、3像素问题使用float引起的，解决方案使用dislpay:inline -3px
3、超链接hover点击后会失效，应使用正确的书写顺序 link visited hover active
4、IE的 z-index问题，解决方案给父级添加position:relative
5、无法定义1px左右的宽度容器（ IE6默认的行高造成的 )，解决方案使用over:hidden,zoom:0.08 line-height:1px）
6、 IE6不支持PNG透明背景，解决办法: IE6下使用gif图片

2、sessionStorage和localStorage的区别？

1、sessionStorage：不是一种持久化的本地存储，仅仅是会话级别
2、的存储localStorage：用于持久化的本地存储，除非主动删除数据，否则数据是永远不会过期的。

3、html语义化是什么？

1、当页面样式加载失败的时候能够让页面呈现出清晰的结构
2、有利于seo优化，利于被搜索引擎收录（更便于搜索引擎的爬虫程序来识别）
3、便于项目的开发及维护，使html代码更具有可读性，便于其他设备解析。

二、css

1、让文字在垂直和水平方向上重叠的两个属性？

1、垂直方向：line-height
2、水平方向：letter-spacing（可消除inline-block元素间的换行符空格间隙问题）

2、如何垂直居中一个

#container     //<img>的容器设置如下
{
    display:table-cell;
    text-align:center;
    vertical-align:middle;
}

3、px和em的区别。

px和em都是长度单位，区别是
1、px的值是固定的，指定是多少就是多少，计算比较容易。
2、em得值不是固定的，并且em会继承父级元素的字体大小。
浏览器的默认字体高都是16px。所以未经调整的浏览器都符合: 1em=16px。那么12px=0.75em, 10px=0.625em。

4、Sass、LESS是什么？为什么需要使用

1、他们是CSS预处理器。他是CSS上的一种抽象层。他们是一种特殊的语法/语言编译成CSS。
2、例如Less是一种动态样式语言. 将CSS赋予了动态语言的特性，如变量，继承，运算， 函数. LESS 既可以在客户端上运行 (支持IE 6+, Webkit, Firefox)，也可一在服务端运行 (借助 Node.js)。
为什么要使用它们？
1、结构清晰，便于扩展。
2、可以方便地屏蔽浏览器私有语法差异，封装对浏览器语法差异的重复处理，减少无意义的机械劳动。
3、可以轻松实现多重继承。
4、完全兼容 CSS 代码，可以方便地应用到老项目中

5、优先级算法

!important > id > class > 标签
!important 比 内联优先级高
优先级就近原则，样式定义最近者为准;
以最后载入的样式为准