开始入坑CSS了
一、CSS基本语法和结构
语法结构： 选择器名称{ 声明语句1; 声明语句2; 声明语句3;......声明语句N; }
例如： h1{ font-size:12px; color:red; ......}
<style></style>标签：使用style标签并在style标签中书写css语句是引用css的三种方法之一，通常style标签包裹在head中
例如：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>我是网页标题名</title>
<style type="text/css">
h1{
font-size: 20px;
color: red;
}
</style>
</head>
<body>
我只是简简单单的一个网页
</body>
</html>
CSS选择器——标签选择器、类选择器、ID选择器
标签选择器：顾名思义，就是HTML网页中各类标签的名称作为选择器名称，作用范围就是该标签包裹的内容
例如：
类选择器：自己定义一个选择器名称，语法格式为： .选择器名称{ 声明语句; } 也就在选择器名称前面加上一个“.”
而当需要使用该选择器时，在要使用的标签中 加入一个属性 class = "选择器名称"
例如： .myClass{ 声明语句; }
<p class="myClass">我是一个网页</p>
ID选择器：
（
对于ID选择器唯一性的理解：
在css里是可以多次使用的。但如果页面涉及到js，就不好了。因为js里获取DOM是通过getElementById，而如果页面出现同一个id几次，这样就获取不到了。所以id要有唯一性。
最后，成熟网站里，你很少看到css里用id选择器的，都是用class，id选择器留给写js的人用，这样避免冲突。
）
语法定义方式类似于类选择器，在使用ID选择器的时候，在要使用ID选择器的标签中加入一个属性 ID="选择器名称"
例如：#myclass{ 声明语句; }
<p id="myclass">我也是一个网页</p>
CSS引用方式
1.行内样式
在标签内直接添加style属性进行设置 。 例如：<p style="font-size: 12px;">我是一个网页</p>
2.内部样式
就如我们在上面讲到的style标签，即在style标签中书写css语句
3.外部引用CSS文件
在这就介绍一种比较常用的外部引用方式：在head中
<link href="CSS文件路径" rel="stylesheet" type="text/css" />
CSS的高级应用（后代选择器、交集选择器、并集选择器）
1.后代选择器：
在CSS选择器中通过嵌套的方式，对特殊位置的HTML标签进行声明
外层的标签写在前面，内层的标签写在后面，之间用空格分隔
标签嵌套时，内层的标签成为外层标签的后代
例如：h3 strong{color:blue; font-size:36px;}
2.交集选择器
由两个选择器直接连接构成，选中二者各自元素范围的交集
第一个必须是标签选择器，第二个必须是类选择器或者ID选择器
选择器之间不能有空格，必须连续书写
例如：p.txt{color:blue; line-height:28px;}
3.并集选择器
多个选择器通过逗号连接而成
利用并集选择器同时声明风格相同样式
例如：
h3,.first,.second,#end{
font-size:16px;
color:green;
font-weight:normal;
}
扫一扫
20万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
