css基础

css第一种写法 内部样式表

css第二种写法 内联样式表，行内部样式表

css第三种写法 外部样式表

1、全局选择器   "*"   

"去盒模型默认结构"

*{

        margin: 0;

        padding: 0;

}

2、标签选择器 

"去除无序列表的默认原点"

li{

        list-style: none;

 }

3、类选择器   class  "."  

.ll{

        color: aquamarine;

}

4、id选择器 id   "#"   "唯一性"

#one{

        color: blue;

}

5、群组选择器  ","

div,p{

        color: red;

} 

6、层次选择器

        1、后代选择器  用空格表示 

                ul li{

                    color: brown;

                }

                ul a{

                    background-color:blue;

                } 

            2、子代选择器  用>表示 */

                 li>a{

                    color: yellow;

                }

                body ul li a{

                    color: red;

                } 

             3、相邻弟 用+表示  挨着的

                div+p{

                    color: cadetblue;

                }

            4、通用兄弟  用~表示 

                 ul li~p{

                    color: darkmagenta;

                } 

7、伪类选择器 

                1、状态伪类   a 

                /* 顺序不能改 */

                /* 默认情况下状态 */

                a:link{color: red;}

                /* 访问过后状态 */

                a:visited{color: green;}

                /* 鼠标悬浮的状态 */

                a:hover{color: blue;}

                /* 鼠标按下去的那一刻状态 */

                a:active{color: coral;}

                p::after{

                    content: "3333";

                }

                 /* 结构伪类 */

                ul li:nth-child(5){

                    color: green;

                }

style > id > class > tag标签 >* > 继承