现在的位置: 首页 > 综合 > 正文

Css学习纪要

2013年12月11日 ⁄ 综合 ⁄ 共 1133字 ⁄ 字号 评论关闭

1、超链接顺序:love hate(link、visited、hover、active)

2、块级:div p form ul ol li,行内:span(内联元素) strong em  ;块级:独占一行、可以设置width、height;行级:不独占一行,不可以设置width、height;

3、display: inline-block非常有用,position:relative,absolutre;float   z-index(由relative、absolutre激活) 

      absolute和float会隐式改变display的类型成inline-block(display:none除外)。

4、水平居中:文本、图片、等行内元素使用text-align:center

       确定宽度的块级元素使用:margin-left:auto;margin-right:auto;

       不确定宽度的块级元素使用:

           1:table不是块级元素,如果不给他设置宽度,他的宽度会由内部撑起来,margin-left:auto;margin-right:auto可以设置table居中

           2:设置成display:inline即可,缺点是不可以设置宽度等相关属性了。

            3:设置父元素float:left,position:relative,left:50%就好了。

5、竖直居中

        父元素不确定高度,文本、图片、块级元素:设置父元素的padding-top、padding-bottom设置成相同值。

        父元素高度确定,单行文本居中:设置height、line-height高度一样,即可。

        父元素高度确定,多行文本、图片、块级元素:

              1:vertical-align只有在父元素是td、th才有效果,其他块级元素(div、p等)无效。在某些浏览器可以设置块级元素的display:table-cell,再用vertical-align可行。

6、利用匿名函数(function(){})();,可以避免变量名冲突。全局变量,最好定义一个对象,在里面的属性实现其定义变量的效果,例如:var GLOBAL={}。          

7、兼容性:nextSibling、透明度(ie通过滤镜,firefox通过css的opacity)、event(ie下作为window的属性作用于全局,派生事件对象是srcElement访问。firefox中作为事件的参数,派生事件对象是target访问。)、冒泡、绑定多个事件(attachEvent、addEventListener)

开发中遇到的问题:

      1、标签之间换行,会形成空格。

抱歉!评论已关闭.