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标签 >* > 继承