九阴真经第二层第2天

心得经验

1.所有行内元素或行内块元素如果想让它文字去到右边直接用text-align
2.ctrl +g 定位行号
3.假如元素没有设置宽
一个盒子你不给它宽度它是默认和父亲盒子宽度一样。但是假如这个你没有设宽度的盒子你让它浮动了或绝对定位了或者是inline-block了，那么这个盒子会和内容一样宽。
4.z-index 要提就提父亲
5.只要有背景图的盒子，我们都要给盒子加宽高，不然背景图显示不全

6.如果给一个盒子加了绝对定位，但是却不写 left ,top 这些，那么盒子就按照原来默认的标准流位置

7.同时写left:0 rigth:0 它是不冲突的，很特殊。即是同时写了，它会优先先左很右，先上后下

8.要是子盒子设了position:absoulute ，父盒子没设position ，那么它会一直寻找祖父盒子是否有，一直找

9.行内块元素都用text-align 来居中对齐

10.浏览器ctrl+ 0 是恢复百分之100%
11.小技巧：一般文字加图标那种，可以在父盒子里先用padding 挤开文字，然后在那块不能写内容的地方用绝对定位添上图标

12.其实，清除浮动就相当于创建了一个BFC区域。 BFC区域：简单说，就是这块地放特立独有，里面发生什么都不会影响外面

13.如果其他盒子浮动，而有个兄弟盒子是不浮动的，兄弟盒子里面又有文字，且没设高度。会被那写浮动的盒子间隔撑大兄弟盒子高度，即使你设了高度它也一样会间隔撑大高度。高度根据浮动盒子怎么拦住你的文字而定。

鼠标样式

Cursor: pointer 鼠标变成小手
Cursor: default; 小白
Cursor : move; 移动
Cursor : text ; 文本输入

Border-radius

圆角矩形
border-radius: 7px 7px 7px 0;
Border-radius: 左上右上右下左下；顺时针

标签嵌套

块级元素 --- 任何元素可以的。
行内元素 -- 行内元素只嵌套元素 b u span i - s
P 不能放 div 。
a 无所不能。 a里面不能放 a input 等

================================================================================

Z-index 层级 div 层

只有定位的盒子（除了static）才有 z-index
如果都是定位他们默认的z-index 是 0
最后的一个靠上

示例：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <style>
       /* .test {
             150px;
            height: 300px;
            border: 1px solid #ccc;
            margin-top: 100px;
            float: left;
            margin-left: -1px;
        }
        .test:hover {
            border: 1px solid #f40;
            position: relative;
        } */
        .test {
             150px;
            height: 300px;
            border: 1px solid #ccc;
            margin-top: 100px;
            float: left;
            margin-left: -1px;
            position: relative;
        }
        .test:hover {
            border: 1px solid #f40;
            z-index: 1;

        }
    </style>
</head>
<body>
<div class="test"></div>
<div class="test"></div>
<div class="test"></div>
<div class="test"></div>
<div class="test"></div>
</body>
</html>

背景半透明

CSS3
**Background: rgba(0,0,0,0.5); **
Opacity: 0.5; 让盒子半透明里面的内容也半透明

九阴真经 第二层 第2天