<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>基本选择器</title>
<!-- 选择器的作用：选择页面上的某一个或某一类元素 -->
<!-- 三种类型选择器的优先级：id选择器>class选择器>标签选择器 -->
<style>
/* 标签选择器，会选择到页面上所有的这个标签的元素 */
h1{
color: rgba(36, 83, 84, 0.933);
}
p{
font-size: 80px;
}
</style>
<style>
/* 类选择器的格式 .class的名称{}
好处，可以多个标签归类，是同一个class
*/
.name1{
color: blue;
}
.name2{
color: chartreuse;
}
</style>
<style>
/* id选择器：id必须保证全局唯一
#id名称{}
*/
#b1{
color: #c01fa7;
}
</style>
</head>
<body>
<h1>学Java1</h1>
<h1>学Java2</h1>
<p>太难了</p>
<hr>
<h1 class="name1">标题1</h1>
<h1 class="name2">标题2</h1>
<h1 class="name1">标题3</h1>
<hr>
<h1 id="b1">标题1</h1>
<h2>标题2</h2>
<h3>标题3</h3>
</body>
</html>
<!-- 基本选择器
1、标签选择器：选择一类标签 标签{}
2、类选择器class:选择所有class属性一致的标签，跨标签 .类名{}
3、id选择器：全局唯一！ #id名{}
优先级：id>class>标签
-->
1510
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
