html5小知识点

 知识因为被分享,才会更有意义 

1.css选择器的优先级:

1.  !important>行间样式>ID选择器>属性选择器&&伪类选择器>类选择器>元素选择器

           a.!important:优先级最大10000（用了后就不能修改 慎用）

           b:行内样式：优先级1000

           c:ID选择器：优先级100

           d:类选择器：优先级10 (伪类属性优先级10 div:first-child == 11)

           e:元素选择器：优先级1

2. css隐藏

        1.visibility: hidden;保留原来位置

         2.display: none;不保留原来位置.

3.css块级,内联,内联块,浮动区别。

      1.块级元素(block): 独占一行,支持宽高设置,高度自适应,支持所有css样式.

      2.内联(inline): 不支持宽高,同排显示,换行被解析.

      3 内联块(inline-block): 让块元素同排显示,内联支持宽高,默认内容撑开宽高,换行被解析,ie6 7不支持inline-block属性.

     4.浮动: 使用支持宽高设置,块元素可以同排显示,默认内容撑开宽高,换行不被解析.

4.css 子元素的margin-top会传给父元素引起的bug修改方法:

      1.用父元素的margin-top代替

      2.给父元素添加overflow: hidden;

      3.给父元素添加border(除了none以外)

5.css定位(position):

        相对定位：relative 正常位置定位

        绝对定位：absolute相对于第一个父元素定位(父元素满足position:relative,fixed,absolute),否则相对于body定位。

        相对窗口定位： fixed

         默认定位：static 不受left,top,right,影响。