什么是css
css即层叠样式表,用于控制网页数据的表现,使得网页数据和表现控制分离。
css引入的是四种方式
行内式
行内式就是在标签内部的style属性编辑控制方式。这种方式,不能体现css的优势,不推荐!
<p style="background-color: rebeccapurple">hello css</p>
嵌入式
嵌入式指的是在head标签中,嵌入style标签控制对应的标签
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
p{
background-color: rebeccapurple;
}
</style>
</head>
链接式
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="1.css">
</head>
导入式
同样在head标签中嵌套style,然后在style里导入css文件链接
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
@import "1.css";
</style>
</head>
注意:使用导入式,css是在整个页面都加载后再导入的,这样就可能导致网页在一个短时间内处于杂乱的状态。但是链接式不一样,他是在加载网页内容前,先导入的,所以不存在这个问题。
css选择器
css选择器是指如何去选择具体的某个标签,然后去实现控制。
1.基础选择器
*:通用元素选择器,控制所有的标签
*{background-color: rebeccapurple}
E:标签选择器,控制所有该标签的样式
p*{background-color: rebeccapurple}
.info class选择器 也可以具体指定某个标签下的选择器 E .class
.abc{background-color: rebeccapurple}
div .abc{background-color: red}
#info E #info id 选择器。 ID是唯一的,class也可以不唯一。
#abc{background-color: rebeccapurple}
div #abc{background-color: red}