结构伪类选择器
伪类选择器:用来描述一个元素的特殊状态!比如第一个元素、某个元素的子元素、鼠标点击的元素
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()

浏览器翻译如下:

相关文章:
结构伪类选择器
伪类选择器:用来描述一个元素的特殊状态!比如第一个元素、某个元素的子元素、鼠标点击的元素 1 first-child/last-child /*ul的第一个子元素*/ ul li:first-child{ background: #0f35ad; } /*ul的最后一个子元素*/ ul li:last-child{ background: #0f3…...
java-- 静态数组
1.静态初始化数组 定义数组的时候直接给数组赋值。 2.静态初始化数组的格式: 注意: 1."数据类型[] 数组名"也可以写成"数据类型 数组名[]"。 2.什么类型的数组只能存放什么类型的数据 3.数组在计算机中的基本原理 当计算机遇到…...
世界经济论坛:ChatGPT等生成式AI,对全球23%岗位产生巨大影响
世界经济论坛与全球最大上市咨询公司之一埃森哲合作,联合发布了《未来工作:大语言模型与就业》白皮书。 世界经济论坛表示,随着ChatGPT、Midjourney、Github Copilot等生成式AI的飞速发展,对全球经济和劳动市场产生巨大影响。未来…...
myTracks for Mac:GPS轨迹记录器的强大与便捷
你是否曾经在户外活动或旅行中,希望能够记录下你的移动轨迹?或者在工作中,需要跟踪你的行程路线?myTracks for Mac 是一款强大的 GPS 轨迹记录器,它可以帮助你实现这些愿望。 myTracks 是一款专门为 Mac 设计的 GPS 轨…...
Macos视频增强修复工具:Topaz Video AI for mac
Topaz Video AI是一款使用人工智能技术对视频进行增强和修复的软件。它可以自动降噪、去除锐化、减少压缩失真、提高清晰度等等。Topaz Video AI可以处理各种类型的视频,包括低分辨率视频、老旧影片、手机录制的视频等等。 使用Topaz Video AI非常简单,…...
如何在IDEA中配置指定JDK版本?轻松解决!!!
有时候我们在导入项目,如果手动在IDEA中指定jdk版本,往往启动项目会报错误。 因此当我们新引入项目启动不了时可以检查一下自己IDEA中的jdk版本是否正确。 下面以配置jdk版本为11显示步骤: 1、配置 Project Structure 1.1、通过快捷键&qu…...
思维导图软件 ConceptDraw MINDMAP mac中文特色介绍
ConceptDraw MINDMAP mac是一款思维导图绘制软件,它可以帮助用户快速创建各种类型的思维导图,如组织结构图、流程图、概念图和UML图等。该软件具有直观的界面和简单易用的操作方式,使得用户能够轻松地创建复杂的思维导图。此外,它…...
PDF编辑工具Acrobat Pro DC 2023中文
Acrobat Pro DC 2023是一款全面、高效的PDF编辑和管理软件。它提供了丰富的PDF编辑功能,如创建、编辑、合并、分割、压缩、旋转、裁剪等,让用户可以轻松处理各种PDF文档。同时,该软件还具有智能的PDF处理技术,可以自动识别和修复P…...
如何开通 Medium会员
1 开通 WildCard 卡 首先你需要一张可以支付的外国卡 选择开通 WildCard 卡,优点: 1 无需上传身份证件,支付宝认证即可 2 可以使用国内手机号注册 3 可以使用支付宝、微信充值 开通地址: https://bewildcard.com/card 一步一步…...
CDN是如何一步步壮大到现在这样的
当我们浏览网页、观看在线视频或下载文件时,CDN(内容分发网络)已经成为网络世界中不可或缺的一部分。本文将探讨CDN的发展历程,其工作原理,以及它如何利用不同地区来提供更快速、可靠的内容交付服务。 CDN的发展历程 过…...
【Java】电子病历编辑器源码(云端SaaS服务)
电子病历编辑器极具灵活性,它既可嵌入到医院HIS系统中,作为内置编辑工具供多个模块使用,也可以独立拿出来,与第三方业务厂商展开合作,为他们提供病历书写功能,充分发挥编辑器的功能。 电子病历基于云端SaaS…...
解决netty作为web,post请求体过大导致413 Request Entity Too Largew问题
问题 项目中使用netty作为web服务,postman请求体内容超出5mb请求netty时,返回413 Request Entity Too Large 解决 查询了一下资料:https://netty.io/4.0/api/io/netty/handler/codec/http/HttpObjectAggregator.html ChannelPipeline p .…...
【Linux】rpm和yum的使用
不知道是不是有和我一样的宝子们,在rpm上卡了老久老久,但其实搞通了,理解了原理之后,不难的,所以不管你现在遇到的困难是什么,都不要放弃,一定要坚持,加油。 一、rpm 1.rpm rpm的…...
贪心算法学习——最大数
目录 编辑 一,题目 二,题目接口 三,解题思路级代码 一,题目 给定一组非负整数 nums,重新排列每个数的顺序(每个数不可拆分)使之组成一个最大的整数。 注意:输出结果可能非常大…...
next项目部署到云服务器上(手动)
准备环境: 云服务器 ECS,服务器安装好了docker 自己的next项目 开始: 1.在next项目根目录下创建Dockerfile文件 FROM node:18-alpine AS base# Install dependencies only when needed FROM base AS deps # Check https://github.com/nodejs/docker-node/tree/b4117f9333d…...
CG Magic分享3dmax软件安装与打开文件转圈圈怎么办?
大家使用3dmax软件时,尤其,是初学者无论是安装3dmax软件还是打开max文件时,会遇到一类问题: 3dmax一直转圈不动? 3dmax总是转圈怎么办 大家遇到3dmax一直转圈圈是如何解决的呢?小编这里整理了一些3dmax软…...
京东(天猫)数据分析:2023下半年茶饮料市场高速增长,东方树叶一骑绝尘
当前在食品饮料行业中,整体的增长放缓,且各个细分品类上都已经充分竞争。但茶饮料市场例外,近两年呈现高增长的态势,一来取决于行业头部企业也在积极推动茶饮料不断升级,另外是主打更健康、更时尚的茶饮料深受年轻消费…...
软件测试之【单元测试、系统测试、集成测试】
一、单元测试的概念 单元测试(Unit Testing)是对软件基本组成单元进行的测试,如函数(function或procedure)或一个类的方法(method)。当然这里的基本单元不仅仅指的是一个函数或者方法ÿ…...
安装 tensorflow==1.15.2 遇见的问题
一、直接安装 命令:pip install tensorflow1.15.2 二、换 阿里云 镜像源 命令:pip install -i http://mirrors.aliyun.com/pypi/simple tensorflow1.15.2 三、换 豆瓣 镜像源 命令:pip install http://pypi.douban.com/simple tensorflow1…...
OJ刷题 第十八篇(递归篇)
34101 - 全排列问题(目前遇到最难的一个递归) 时间限制 : 1 秒 内存限制 : 128 MB 输出自然数 1 到 n 所有不重复的排列,即 n 的全排列,要求所产生的任一数字序列中不允许出现重复的数字。 输入 n(1≤n≤9) 输出 由 1…...
论文解读:交大港大上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架(二)
HoST框架核心实现方法详解 - 论文深度解读(第二部分) 《Learning Humanoid Standing-up Control across Diverse Postures》 系列文章: 论文深度解读 + 算法与代码分析(二) 作者机构: 上海AI Lab, 上海交通大学, 香港大学, 浙江大学, 香港中文大学 论文主题: 人形机器人…...
Java如何权衡是使用无序的数组还是有序的数组
在 Java 中,选择有序数组还是无序数组取决于具体场景的性能需求与操作特点。以下是关键权衡因素及决策指南: ⚖️ 核心权衡维度 维度有序数组无序数组查询性能二分查找 O(log n) ✅线性扫描 O(n) ❌插入/删除需移位维护顺序 O(n) ❌直接操作尾部 O(1) ✅内存开销与无序数组相…...
ElasticSearch搜索引擎之倒排索引及其底层算法
文章目录 一、搜索引擎1、什么是搜索引擎?2、搜索引擎的分类3、常用的搜索引擎4、搜索引擎的特点二、倒排索引1、简介2、为什么倒排索引不用B+树1.创建时间长,文件大。2.其次,树深,IO次数可怕。3.索引可能会失效。4.精准度差。三. 倒排索引四、算法1、Term Index的算法2、 …...
[Java恶补day16] 238.除自身以外数组的乘积
给你一个整数数组 nums,返回 数组 answer ,其中 answer[i] 等于 nums 中除 nums[i] 之外其余各元素的乘积 。 题目数据 保证 数组 nums之中任意元素的全部前缀元素和后缀的乘积都在 32 位 整数范围内。 请 不要使用除法,且在 O(n) 时间复杂度…...
Element Plus 表单(el-form)中关于正整数输入的校验规则
目录 1 单个正整数输入1.1 模板1.2 校验规则 2 两个正整数输入(联动)2.1 模板2.2 校验规则2.3 CSS 1 单个正整数输入 1.1 模板 <el-formref"formRef":model"formData":rules"formRules"label-width"150px"…...
视觉slam十四讲实践部分记录——ch2、ch3
ch2 一、使用g++编译.cpp为可执行文件并运行(P30) g++ helloSLAM.cpp ./a.out运行 二、使用cmake编译 mkdir build cd build cmake .. makeCMakeCache.txt 文件仍然指向旧的目录。这表明在源代码目录中可能还存在旧的 CMakeCache.txt 文件,或者在构建过程中仍然引用了旧的路…...
【JVM面试篇】高频八股汇总——类加载和类加载器
目录 1. 讲一下类加载过程? 2. Java创建对象的过程? 3. 对象的生命周期? 4. 类加载器有哪些? 5. 双亲委派模型的作用(好处)? 6. 讲一下类的加载和双亲委派原则? 7. 双亲委派模…...
CSS | transition 和 transform的用处和区别
省流总结: transform用于变换/变形,transition是动画控制器 transform 用来对元素进行变形,常见的操作如下,它是立即生效的样式变形属性。 旋转 rotate(角度deg)、平移 translateX(像素px)、缩放 scale(倍数)、倾斜 skewX(角度…...
FFmpeg avformat_open_input函数分析
函数内部的总体流程如下: avformat_open_input 精简后的代码如下: int avformat_open_input(AVFormatContext **ps, const char *filename,ff_const59 AVInputFormat *fmt, AVDictionary **options) {AVFormatContext *s *ps;int i, ret 0;AVDictio…...
WEB3全栈开发——面试专业技能点P7前端与链上集成
一、Next.js技术栈 ✅ 概念介绍 Next.js 是一个基于 React 的 服务端渲染(SSR)与静态网站生成(SSG) 框架,由 Vercel 开发。它简化了构建生产级 React 应用的过程,并内置了很多特性: ✅ 文件系…...
