<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>类选择器</title>
<style>
.pp{
color:red;
}
.ppp {
color: blue;
}
.pppp {
color: yellow;
}
.ppppp {
color: gray;
}
.para1{
font-size:20px;
}
.para2{
font-style:italic;
}
</style>
</head>
<body>
<!--
1.什么是类选择器?
作用:根据指定的类名称找到对应的标签,然后设置属性
格式:
.类名{
属性:值;
}
注意点:
1.每个HTML标签都有一个属性叫做class,也就是说每个标签都可以设置类名
2.在用一个界面中class的名称是可以重复的
3.在编写class选择器时一定要在class名称前面加上.
4.类名的命名规范和id名称的命名规范一样
5.类名就是专门用来给某个特定的标签设置样式的
6.在HTML中每个标签可以同时绑定多个类名
格式:
<标签名称 class="类名1 类名2 ...">
-->
<p class="pp">迟到毁一生</p>
<p class="ppp">早退穷三代</p>
<p class="pppp">按时上下班</p>
<p class ="ppppp">必成高富帅</p>
<p class="para1 para2">我是段落</p>
</body>
</html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>类选择器</title>
<style>
.pp{
color:red;
}
.ppp {
color: blue;
}
.pppp {
color: yellow;
}
.ppppp {
color: gray;
}
.para1{
font-size:20px;
}
.para2{
font-style:italic;
}
</style>
</head>
<body>
<!--
1.什么是类选择器?
作用:根据指定的类名称找到对应的标签,然后设置属性
格式:
.类名{
属性:值;
}
注意点:
1.每个HTML标签都有一个属性叫做class,也就是说每个标签都可以设置类名
2.在用一个界面中class的名称是可以重复的
3.在编写class选择器时一定要在class名称前面加上.
4.类名的命名规范和id名称的命名规范一样
5.类名就是专门用来给某个特定的标签设置样式的
6.在HTML中每个标签可以同时绑定多个类名
格式:
<标签名称 class="类名1 类名2 ...">
-->
<p class="pp">迟到毁一生</p>
<p class="ppp">早退穷三代</p>
<p class="pppp">按时上下班</p>
<p class ="ppppp">必成高富帅</p>
<p class="para1 para2">我是段落</p>
</body>
</html>