CSS——10.类选择器

时间sk2025-01-06 14:20

html 复制代码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			.zxw{
				color: red;
				font-weight: 600;
			}
			.abc{
				font-size: 30px;
			}
		</style>
		
	</head>
	<body>
		<!--类选择器：-->
			<!--1.class属性是标准属性，任何元素都可以有class属性。-->
			<!--2.使用class（类）选择器时，要在class值前加上"."-->
			<!--3.class选择器可以被多个元素共同使用,不同元素可以有相同的class值-->
			<!--4.同一个元素可以有多个类名，要使用空格隔开-->
			<!--<p class="zxw abc">我爱学习2</p>该p元素标签 有俩个类名分别为类名1：zxw abc。类名2：abc-->
			<!--5.在实际开发中尽量使用类选择器，因为类选择器就是给CSS使用的，而id是给JS使用的-->
			
		
			<div>
				<div class="zxw">我爱学习1</div>
				<p class="zxw abc">我爱学习2</p>
				<span class="zxw">我爱学习3</span>
			</div>
			
			
			
			<strong class="abc">我爱学习4</strong>
		
	</body>
</html>

将块标签中的所有元素都加上某种样式，就可以用class 来进行样式添加，这种情况类选择器是最方便的