1:元素选择器
作用:根据标签名来选中指定的元素
语法:标签名{}
例子:p{},h1{},h3{}
2:id选择器
作用:根据元素的id属性值选中一个元素
语法:#id属性值{}
例子:#p1{}
3:class选择器
作用:根据元素的class属性值为元素分组,它和id类似,不同的是可以重复使用
语法:.class属性值{}
例子:.p2{}
4:通配选择器
作用:选中页面中的所有元素
语法:*{}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>选择器</title>
<style>
/* 需求一:标题变红色 */
h1 {
color: red;
}
/* 需求二:将第一句诗变绿色 */
#p1 {
color: green;
}
/* 需求三:将第二句诗也变绿色 */
.p2 {
color: green;
}
.a2{font-size: 22px;}
/* 需求四:给所有的标签字体变为24px */
*{font-size: 24px;}
</style>
</head>
<body>
<h1>登高</h1>
<h3>杜甫</h3>
<p id="p1">风急天高猿啸哀,渚清沙白鸟飞回。</p>
<p class="p2 a2">无边落木萧萧下,不尽长江滚滚来。</p>
<p>万里悲秋常作客,百年多病独登台。</p>
<p>艰难苦恨繁霜鬓,潦倒新停浊酒杯。</p>
</body>
</html>