css完结

css完结版

解决浮动带来的影响

浮动的坏处 当标签内部的标签浮动的话 会造成父标签包括不住字标签。

解决的方法有两种：

1. 设置一个有高度的div

2. 利用clear属性

   clear属性:

3. 通用的解决浮动带来影响的方法

   .clearfix:after {
       content:'';
       display:block;
       clear:both;
   }
   

溢出属性

overflow:visible   默认就是可见
    	hidden   溢出部分不可见
        scroll   上下滚动条的形式
        auto  上下、左右滚动的形式

定位

1. static	静态：无法改变位置
2.relative	相对定位：可以做位置移动
3.absolute	绝对定位：相对于已经定位过的父标签做出移动
4.fixed		固定定位：固定在一个位置

验证浮动和定位是否脱离文档流（原来的位置是否还保留）

不脱离文档流：相对定位

脱离文档流：

1. 浮动

​ 2. 绝对定位

​ 3. 固定定位

z-index模态框

百度的登陆页面实际就是三层结构

1. 最底部的是正常内容z=0

2. 黑色的透明区z=99

   这可以相对于浏览器进行定位：position:fixed

3. 白色的注册区z=100

   这可以相对于浏览器进行定位：position:fixed

透明度

1. rgba的四个参数中的第四个参数只是更改颜色的透明度
2. opacity:这个可以更改字体和颜色的透明度