一,margin
1.标准文档流,margin在竖直方向的不叠加,以较大的为准 2.使用margin:0 auto;的盒子必须有明确的width,并且只有标准文档流的盒子 才能使用margin:0 auto; 3.善于使用父亲的padding而不是儿子的margin;
二,css精灵 1.css精灵优点,减少http请求 2.通过background-position来控制显示位置 3.background-attachment:fixed; 背景图片固定,不随滚动条滚动 4 精灵的使用 background url(inages/1.jpg) no-repeat 0 -133px; 三,定位 1.相对定位 position:relation; right: -100px; bottom:-100px; 元素微调和做绝对定位的参考 2.一个绝对定位的元素,如果父辈元素中出现了也定位了的元素,那么将以父辈这个元素,为参考点 3.子类绝对定位父类相对定位用的比较多 4.绝对定位后的盒子居中 600px; height:60px; position:absulate; left:50%; top:0; margin-left:-300px;(为实际宽度的一半) 5.固定定位相对浏览器窗口定位:position:fiexd; 四,浮动 1.浮动的元素脱标 2.浮动的元素互相贴靠 3.浮动的元素有“字围”效果 五,清除浮动 1.父类div设置height 2.clear:both 3.隔墙div 4.overflow:hidden;
六,块级元素和行内元素
1.块级元素 <p> 霸占一行,不能与其他任何元素并列 能接受宽,高 如果不设置设置宽度,宽高默认为父亲的100% 2.行内元素 <span> 与其他元素并排 不能设置宽高,默认宽高就是文字的宽高。 display:inline; 让块级元素变为标签。 display:block; 让标签元素变为块级元素。 七,伪类 display: block; 将元素弄成块级元素 伪类<a>标签 :link 没有点击过的样式 :visited点击过的样式 :hover 鼠标悬停的样式 :active 鼠标点击不松的样式
八,z-index
1.只有定位了的元素,才能有z-index值。也就是说,不管相对定位、绝对定位、固定定位,都可以使用z-index值。而浮动的东西不能用。
2.z-index值就是一个正整数。默认的z-index值是0。
3.如果大家都没有z-index值,或者z-index值一样,那么谁写在HTML后面,谁在上面能压住别人。定位了的元素,永远能够压住没有定位的元素。