结构伪类选择器

伪类选择器:用来描述一个元素的特殊状态!比如第一个元素、某个元素的子元素、鼠标点击的元素

1  first-child/last-child

/*ul的第一个子元素*/
ul li:first-child{
background: #0f35ad;
}
/*ul的最后一个子元素*/
ul li:last-child{
background: #0f35ad;
}

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>Title</title><style>/*ul的第一个子元素*/ul li:first-child{background: #0f35ad;}/*ul的最后一个子元素*/ul li:last-child{background: #0f35ad;}</style>
</head>
<body>
<h1>h1</h1>
<p>p1</p>
<p>p2</p>
<p>p1</p>
<ul><li>l1</li><li>l2</li><li>l3</li>
</ul>
</body>
</html>

浏览器翻译如下:

 

2  nth-child()

/*定位到父元素,选择当前的第一个元素,选择当前p元素的父级元素,选中父元素的第一个,并且是当前元素才有效*/
p:nth-child(1){
background: #0f35ad;
}

 

注意:如果第一个不是当前元素无效 

浏览器翻译如下: 

 3 nth-of-type()

 浏览器翻译如下:

 

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

ExcelPatternTool 开箱即用的Excel工具包现已发布!

文章目录 ExcelPatternTool功能特点&#xff1a;快速开始使用说明常规类型高级类型Importable注解Exportable注解IImportOption导入选项IExportOption导出选项单元格样式StyleMapping样式映射使用数据库作为数据源 示例Sample1&#xff1a;不同类型字段导出Sample2&#xff1a;…

ChatGLM系列七:LangChain+ChatGLM-6B

背景介绍 在开发过程中&#xff0c;我们经常会遇到需要构建基于本地知识库的问答系统的问题。这种系统需要能够根据用户提供的问题&#xff0c;在本地的知识库中查找并返回相关答案。然而&#xff0c;要实现这样的功能并不容易&#xff0c;涉及到语言模型的选择、知识库的管理…

Vsan数据恢复—Vsan存储断电导致虚拟机无法启动的数据恢复案例

Vsan分布式存储故障&检测&#xff1a; 异常断电导致一台vsan存储设备上层虚拟机无法启动。 将故障Vsan存储上的所有磁盘编号后取出&#xff0c;由北亚企安的硬件工程师对vsan存储上的所有硬盘进行物理故障检测&#xff0c;经过检测没有发现硬盘存在物理故障。 vsan存储结构…

问界新M7也扛起“遥遥领先”大旗,华为究竟做对了什么?

循着时间脉络&#xff0c;华为似乎正在实现全方面的“遥遥领先”。 继Mate 60系列手机产品的强势回归之后&#xff0c;华为参与的汽车项目也登上了“热搜榜”。近段时间&#xff0c;问界新M7正处于“卖爆”状态。 据了解&#xff0c;2023年9月12日&#xff0c;华为发布了问界…

公网IP怎么设置?公网ip有哪些优点和缺点?

随着互联网的普及&#xff0c;越来越多的人开始关注网络安全和隐私保护。其中&#xff0c;公网IP的设置成为了一个备受关注的话题。本文将详细介绍公网IP的设置方法以及公网IP的优点和缺点。 一、公网IP设置方法 1. 路由器设置 在家庭或企业网络中&#xff0c;路由器通常是最重…

【Linux】开发工具

目录 Linux编译器-gcc/g使用执行命令&#xff1a;我们的.o和库是如何链接的? make/Makefile依赖关系、依赖方法 Linux编译器-gcc/g使用 gcc只能编译c语言&#xff0c;g可以编译c语言也可以编译g 背景知识&#xff1a; 预处理&#xff08;进行宏替换)编译&#xff08;生成汇编)…

荣耀推送服务消息分类标准

前言 为了提升终端用户的推送体验、营造良好可持续的通知生态&#xff0c;荣耀推送服务将对推送消息进行分类管理。 消息分类 定义 荣耀推送服务将根据应用类型、消息内容和消息发送场景&#xff0c;将推送消息分成服务通讯和资讯营销两大类别。 服务通讯类&#xff0c;包…

JS清除字符串中的空格

一、replace()方法 replace方法在字符串中搜索值或正则表达式&#xff0c;返回已替换值的新字符串&#xff0c;不会更改原始字符串。 去除字符串内所有的空格&#xff1a;str str.replace(/\s*/g,“”) 去除字符串内两头的空格&#xff1a;str str.replace(/^\s*|\s*$/g,“…

Mac怎么清理磁盘空间?释放Mac磁盘空间有效方法

相信很多使用macOS系统的小伙伴都收到过提示“磁盘空间已满”消息&#xff0c;尤其是采用SSD固态硬盘的MacBook系列&#xff0c;120G的硬盘空间本就捉襟见肘&#xff0c;使用一段时间后&#xff0c;即使自己没有存放很多大文件&#xff0c; Mac的磁盘很快就满了。那么&#xff…

使用python实现http协议的方法

要使用Python编写一个接口&#xff0c;其入参格式为x-www-form-urlencoded&#xff0c;你可以使用requests库。requests库是一个流行的HTTP库&#xff0c;它使得发送HTTP请求变得非常简单。 下面是一个简单的示例&#xff0c;展示如何使用requests库发送一个POST请求&#xff…

【面试经典150 | 链表】两数相加

文章目录 写在前面Tag题目来源题目解读解题思路方法一&#xff1a;模拟 其他语言python3 写在最后 写在前面 本专栏专注于分析与讲解【面试经典150】算法&#xff0c;两到三天更新一篇文章&#xff0c;欢迎催更…… 专栏内容以分析题目为主&#xff0c;并附带一些对于本题涉及到…

升级 Xcode 15模拟器 iOS 17.0 Simulator(21A328) 下载失败

升级 IDE Xcode 15 后本地模拟器 Simulator 全被清空,反复重新尝试 Get 下载频频因网络异常断开而导致失败 ... 注:通过 Get 方式下载一定要保证当前网络环境足够平稳,网络环境不好的情况下该方法几乎成不了 解决办法 Get 方式行不通可以尝试通过 官网 途径先下载 模拟器安装包…

大模型 | NEFTune之引入随机噪声对大模型训练的收益

大模型 | NEFTune之引入随机噪声对大模型训练的收益 paper中提到&#xff0c;在模型foward过程中&#xff0c;对inputs_embedding增加适度的随机噪声&#xff0c;会带来显著的收益。 Paper: https://arxiv.org/pdf/2310.05914.pdf Github: https://github.com/neelsjain/NEFT…

网络攻击的发展

在当今数字化时代&#xff0c;网站被攻击已经成为常态&#xff0c;网络威胁愈演愈烈。这些攻击不仅威胁到企业的安全&#xff0c;还可能导致严重的商业危机。本文将探讨为什么网络流量攻击变得如此普遍和容易&#xff0c;并分析未来可能引发的商业危机。 ​ 网络流量攻击的普遍…

【OpenCV实现图像的几何变换】

文章目录 概要&#xff1a;OpenCV实现图像的几何变换、图像阈值和平滑图像变换小结 概要&#xff1a;OpenCV实现图像的几何变换、图像阈值和平滑图像 使用OpenCV库进行图像处理的三个重要主题&#xff1a;几何变换、图像阈值处理以及图像平滑。在几何变换部分&#xff0c;详细…

【Linux精讲系列】——yum软件包管理

​作者主页 &#x1f4da;lovewold少个r博客主页 ⚠️本文重点&#xff1a;Linux系统软件包管理工具yum讲解 &#x1f604;每日一言&#xff1a;踏向彼岸的每一步&#xff0c;都是到达彼岸本身。 目录 前言 Linux系统下的软件下载方式 yum 查看软件包 如何安装软件 如何卸…

myTracks for Mac:GPS轨迹记录器的强大与便捷

你是否曾经在户外活动或旅行中&#xff0c;希望能够记录下你的移动轨迹&#xff1f;或者在工作中&#xff0c;需要跟踪你的行程路线&#xff1f;myTracks for Mac 是一款强大的 GPS 轨迹记录器&#xff0c;它可以帮助你实现这些愿望。 myTracks 是一款专门为 Mac 设计的 GPS 轨…

微信JSAPI支付对接

简介 JSAPI支付是指商户通过调用微信支付提供的JSAPI接口&#xff0c;在支付场景中调起微信支付模块完成收款。 应用场景 JSAPI支付适用于线下场所、公众号场景和PC网站场景。 商户已有H5商城网站&#xff0c;用户通过消息或扫描二维码在微信内打开网页时&#xff0c;可以调…

机器学习-学习率:从理论到实战,探索学习率的调整策略

目录 一、引言二、学习率基础定义与解释学习率与梯度下降学习率对模型性能的影响 三、学习率调整策略常量学习率时间衰减自适应学习率AdaGradRMSpropAdam 四、学习率的代码实战环境设置数据和模型常量学习率时间衰减Adam优化器 五、学习率的最佳实践学习率范围测试循环学习率&a…

【spark客户端】Spark SQL CLI详解:怎么执行sql文件、注释怎么写,支持的文件路径协议、交互式模式使用细节

文章目录 一. Spark SQL Command Line Options(命令行参数)二. The hiverc File1. without the -i2. .hiverc 介绍 三. 支持的路径协议四. 支持的注释类型五. Spark SQL CLI交互式命令六. Examples1. running a query from the command line2. setting Hive configuration vari…