【CSS】基础选择器

目录

标签选择器

id选择器

类选择器

CSS的编写地点:


标签选择器

说明:标签选择器实际上就是HTML标签元素(可以是任何HTML元素),用来改变一个指定标签的样式

示例: 

<style type="text/css">
			p{
				color: aqua;
				background-color: pink;
			}
			span{
				font-size: 50px;
				text-decoration: underline;
			}
			div
			{
				font-style: initial;
				font-weight: bold;
				text-align: center;
			}
		</style>

id选择器

说明:当我们想要一些特定的HTML元素有一些效果时,我们就可以使用id选择器来进行

 使用id选择器:

把id放在标签当中,并自己给它取个名字

	<p id="p1" >
			段落1
		</p>
		<p id="p2">
			段落2
		</p>
		<p id="p3">
			段落3
		</p>
		

对相应HTML元素进行效果:

用#对应相应的id名

#p1{
	color: green;
	font-size: 50px;
}
#p2{
	color: green;
	text-decoration: underline;
	}
#p3{
	text-decoration: underline;
	font-size: 50px;
}

缺点:如果想要其中两段效果相同,需要重复操作,也就是说,一个id选择器只能定义一个标签,可复用性差

效果:

类选择器

说明:最常用的选择器,可复用性很高,一个类选择器可以用在很多HTML标签上,使得这些标签得到一样的效果。

使用类:class

与id命名相似,自定义一个类名

<p class="c1" >
			段落1
		</p>
		<p class="c2">
			段落2
		</p>
		<p class="c1">
			段落3
		</p>

对对应的标签进行效果

.c1{
	 color:red ;
 }
 .c2{
	 text-decoration: underline;
 }
 
 

 效果:

 

CSS的编写地点:

①可以在html文件中用style标签

<style type="text/css">

在这里写你想要的效果
		
		</style>

 ②可以在CSS文件夹中进行编写(推荐)

就是这个:

今天的分享到这里就结束啦~希望能帮到您!! 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/506855.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

QQ邮箱SMTP发送邮件时要注意哪些安全设置?

QQ邮箱SMTP发送邮件的步骤&#xff1f;如何配置QQ邮箱服务器&#xff1f; 在使用QQ邮箱SMTP发送邮件时&#xff0c;安全设置是至关重要的一环。不当的安全设置不仅可能导致邮件发送失败&#xff0c;还可能使你的账户面临安全风险。下面&#xff0c;AokSend就来详细探讨一下QQ邮…

基于单片机16位智能抢答器设计

**单片机设计介绍&#xff0c;基于单片机16位智能抢答器设计 文章目录 一 概要二、功能设计设计思路 三、 软件设计原理图 五、 程序六、 文章目录 一 概要 基于单片机16位智能抢答器设计是一个结合了单片机技术、显示技术、按键输入技术以及声音提示技术的综合性项目。其设计…

脑机辅助推导算法

目录 一&#xff0c;背景 二&#xff0c;华容道中道 1&#xff0c;问题 2&#xff0c;告诉脑机如何编码一个正方形格子 3&#xff0c;让脑机汇总信息 4&#xff0c;观察图&#xff0c;得到启发式算法 5&#xff0c;根据启发式算法求出具体解 6&#xff0c;可视化 一&am…

苹果App审核大揭秘

苹果上架要求是苹果公司对于提交应用程序到苹果商店上架的要求和规定。这些要求主要是为了保证用户体验、应用程序的质量和安全性。以下是苹果上架要求的详细介绍&#xff1a;1. 应用程序的内容和功能必须符合苹果公司的规 苹果上架要求是苹果公司对于提交应用程序到苹果商店上…

u盘不显示盘符怎么办,u盘不显示盘符

我们经常使用电脑,难免会遇到各种问题,其中U盘不显示盘盘符也是常见的一种。用u盘插入电脑usb接口后,却识别不出u盘,而且更换usb接口以后还是没有u盘盘符,这可怎么用呢?针对此问题,极客狗整理了两个处理方法,接下来带小伙伴一起看看u盘不显示盘符怎么办。遇到同样问题的…

Python数据结构实验 查找实验(一)

一、实验目的 1&#xff0e;熟悉查找的基本概念&#xff0c;包括静态查找表和动态查找表、内查找和外查找之间的差异以及平均查找长度等&#xff1b; 2&#xff0e;掌握线性表上的各种查找算法&#xff0c;包括顺序查找、折半查找和分块查找的基本思路、算法实现和查找效率等…

游戏引擎中的声音系统

一、声音基础 1.1 音量 声音振幅的大小 压强p&#xff1a;由声音引起的与环境大气压的局部偏差 1.2 音调 1.3 音色 1.4 降噪 1.5 人的听觉范围 1.6 电子音乐 将自然界中连续的音乐转换成离散的信号记录到内存中 采样 - 量化 - 编码 香农定理&#xff1a;采样频率是信…

云原生技术精选:探索腾讯云容器与函数计算的最佳实践

文章目录 写在前面《2023腾讯云容器和函数计算技术实践精选集》深度解读案例集特色&#xff1a;腾讯云的创新实践与技术突破精选案例分析——Stable Diffusion云原生部署的最佳实践精选集实用建议分享总结 写在前面 在数字化转型的浪潮下&#xff0c;云计算技术已成为企业运营…

shell脚本发布docker-nginx vue2 项目示例

docker、git、node.js安装略过。 使git pull或者git push不需要输入密码操作方法 nginx安装在docker容器里面&#xff0c;参见&#xff1a;https://blog.csdn.net/HSJ0170/article/details/128631155 姊妹篇&#xff08;宿主机nginx&#xff0c;非docker-nginx&#xff09;&am…

Real-data WRF | setup and run and experiment

前言 Parent Model 用于初始化和边界条件的网格数据 GFS/FNL、NAM、RAP/HRRR、重新分析&#xff08;NARR、CFSR、NNRP、ERA-interim、ERA5 等&#xff09;、其他 WRF 运行 WPS WRF 预处理系统&#xff08;由 geogrid、ungrib 和 metgrid 程序组成&#xff09; WRF 模拟几…

【Linux多线程】生产者消费者模型

【Linux多线程】生产者消费者模型 目录 【Linux多线程】生产者消费者模型生产者消费者模型为何要使用生产者消费者模型生产者消费者的三种关系生产者消费者模型优点基于BlockingQueue的生产者消费者模型C queue模拟阻塞队列的生产消费模型 伪唤醒情况&#xff08;多生产多消费的…

【手册】——mq延迟队列

目录 一、背景介绍二、思路&方案三、过程1.项目为啥用延迟队列&#xff1f;2.项目为啥用三方延迟队列&#xff1f;3.项目中为啥用rabbitmq延迟队列&#xff1f;4.rabbitmq延迟队列的安装5.rabbitmq的延迟队列配置方式5.1.exchange配置5.2.queues配置5.3.exchange和queues的…

文件操作(1)【文件打开和关闭】【文件的顺序读写(各种函数)】【sprintf和sscanf的理解】

一.什么是文件&#xff1f; 在程序设计中我们一般谈的文件有两种&#xff1a;程序文件和数据文件 1.程序文件 程序文件是包含计算机程序代码的文件。它通常包含一系列指令和算法&#xff0c;用于执行特定的任务或实现特定的功能。程序文件可以由不同的编程语言编写&#xff…

【C语言环境】Sublime中运行C语言时MinGW环境的安装

要知道&#xff0c;GCC 官网提供的 GCC 编译器是无法直接安装到 Windows 平台上的&#xff0c;如果我们想在 Windows 平台使用 GCC 编译器&#xff0c;可以安装 GCC 的移植版本。 目前适用于 Windows 平台、受欢迎的 GCC 移植版主要有 2 种&#xff0c;分别为 MinGW 和 Cygwin…

【Python】——变量名的命名规则

&#x1f383;个人专栏&#xff1a; &#x1f42c; 算法设计与分析&#xff1a;算法设计与分析_IT闫的博客-CSDN博客 &#x1f433;Java基础&#xff1a;Java基础_IT闫的博客-CSDN博客 &#x1f40b;c语言&#xff1a;c语言_IT闫的博客-CSDN博客 &#x1f41f;MySQL&#xff1a…

Linux shell编程学习笔记42:md5sum

0 前言 前几天在国产电脑上遇到一个问题&#xff0c;先后接到两个文件&#xff0c;如何判断这两个文件内容是否相同&#xff1f; 如果是在Windows系统&#xff0c;可以用fc命令&#xff0c;或者用我自己写的FileInfo&#xff0c;提取两个文件有MD5、SHA1、CRC32值进行比较来判…

GANs和Diffusion模型(3)

接GANs和Diffusion模型&#xff08;2&#xff09; 扩散(Diffusion)模型 生成学习三重困难(Trilemma) 指生成学习(genrative learning)的模型都需要满足三个需求&#xff1a; 高质量的采样(High Quality Samples)&#xff1a;模型应该能生成非常高质量的采样快速采样(Fast S…

使用 Python 模拟布朗运动(和股票价格)

一、说明 本文先介绍布朗运动的概念&#xff0c;紧接着应用布朗方程到股票的随机斩落模型。进而用python实现&#xff0c;并给出各种各样的条件模型。从中烘托出股票模型的规律所在。 二、什么是布朗运动&#xff1f; 布朗运动以罗伯特布朗的名字命名&#xff0c;他是第一个在通…

持续交付与持续部署相关概念(CD)

目录 一、概述 二、持续交付基本概念 2.1 持续交付的含义 2.1.1 项目管理的视角 2.1.2 产品研发的视角 2.1.3 总结 2.2 持续交付涉及的运作环境 2.2.1 开发环境 2.2.2 测试环境 2.2.3 UAT环境 2.2.4 准生产环境 2.2.5 生产环境 2.3 总结 三、持续部署基本概念 3.…

创新之路:云边对接与行业生态的前沿探索

全球 80% 的数据来自物联网&#xff0c;不论是传统行业还是新兴行业&#xff0c;都将利用更多有价值的数据来驱动业务&#xff0c;实现降本增效。智慧教育、资产追踪、环境监测、工业物联网、智慧城市、家居互联、智慧电力、智慧农业。从智能电表到智能家居&#xff0c;从机器人…