当前位置: 首页 > article >正文

CSS——10.类选择器

<!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 来进行样式添加,这种情况类选择器是最方便的

在这里插入图片描述


http://www.kler.cn/a/468625.html

相关文章:

  • Android 性能优化:内存优化(实践篇)
  • 【three.js】搭建环境
  • 前端访问一个图片URL时,浏览器默认会尝试下载文件而不是直接显示它
  • 1-markdown转网页样式页面 --[制作网页模板] 【测试代码下载】
  • 常用的数据结构API概览
  • 软件工程期末复习(一)
  • 【Go学习】-01-6-数据库泛型新特性
  • 如何处理外在关系以及内在关系,思维冲突和纠结
  • 挑战20天刷完leecode100
  • C语言程序设计(第5版)习题解答-第4章
  • stm32HAL库使LED闪烁
  • ArcGIS中怎么把数据提取到指定范围(裁剪、掩膜提取)
  • RabbitMQ-基本使用
  • ChatGPT 主流模型GPT-4/GPT-4o mini的参数规模是多大?
  • 学习扩散模型的完整指南(前提知识、DDPM、稳定扩散、DreamBooth等)
  • php有两个数组map比较 通过id关联,number可能数量变化 比较他们之间增加修改删除
  • 【机器学习:二、线性回归模型】
  • 前端(API)学习笔记(CLASS 4):进阶
  • Unity3D 如何做好项目性能优化详解
  • 面试题 2024/12 28 29
  • 微服务组件——利用SpringCloudGateway网关实现统一拦截服务请求,避免绕过网关请求服务
  • Python入门教程 —— 面向对象进阶
  • Go语言的 的反射(Reflection)基础知识
  • 基于伪分布式模式部署Hadoop集群
  • 开源模型迎来颠覆性突破:DeepSeek-V3与Qwen2.5如何重塑AI格局?
  • 流光效果