<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
/*
将所有的段落设置为红色(字体)
*/
/* 元素选择器
作用:根据标签名来选中指定的元素
语法:标签名{}
例:p{}
p{
color: crimson;
}
h1{
color:darkblue;
}
*/
/*
id选择器
作用:根据元素的id属性值选中一个元素
语法:#id属性值{}
例子:#box{},#red{}
#red{
color: darkred;
}
*/
/*
类选择器(class选择器):
作用:根据元素的class属性值选中一组元素
语法:.class属性值
.blue{
color: blue;
}
*/
/*
通配选择器
作用:选中页面中所有的元素
语法:*{}
*{
color: blue;
}
*/
</style>
</head>
<body>
<h1>我是标题</h1>
<p>少小离家老大回</p>
<p id="red">乡音无改鬓毛衰</p>
<p class="blue">儿童相见不相识</p>
<!--
class是一个标签的属性,它和id类似,不同的是class是可以重复使用的
我们可以通过class属性来为元素分组
可以同时为一个元素指定多个class属性,多个class值之间使用空格隔开
-->
<p class="blue red">秋水共长天一色</p>
<p>落霞与孤鹜齐飞</p>
<p>笑问客从何处来</p>
</body>
</html>
本笔记是观看尚硅谷HTML5+CSS3时所作,仅供参考!