伪选择器和伪元素选择器

常用伪类

用来添加一些选择器的特殊效果

a:hover:鼠标滑过链接

a:link:未访问链接

a:visited:以访问链接

a:active:已选中链接

:nth-child(n):选择所有冒号前元素的父元素的第二个子元素

常用伪元素

用来添加一些选择器的特殊效果

p:before:在每个p元素之前插入新内容

p:after:在每个p元素之后插入新内容

选择器分组

把具有相同样式的选择器放在一起,这样方便组织和管理。

css 复制代码
h1,h2,h3,h4{
	font-size:20px;
}

兄弟选择器

用~号表示可以影响到一个元素后面所有的同级元素

html 复制代码
<body>
<div class="mi">李子奇</div>
<p class="mi">嫦娥应悔偷灵药,碧海青天夜夜心。"这是唐代诗人李商隐《嫦娥》诗中的两句。嫦娥奔月的故事,早在我国现代就遍及地流传着。</p>
<p>odkjslkdlsjmdl</P>
</body>
css 复制代码
div~p{
	width: 100px;
	height: 20px;
	background-color: aqua;
}
相关推荐
FungLeo1 小时前
成为全栈·Vue 管理后台篇·分类树与标签管理:层级数据如何落到管理界面
前端·javascript·vue.js·分类树·naive ui·标签管理·前端数据结构
Lank_M5 小时前
白底都占八成,PNG 为何只在图表页赢过 JPG
前端
张一凡935 小时前
给 Coding Agent 加一道"架构闸门":Jin 是如何做到"先审架构、再写代码、不漂移"的
前端·后端·agent
Linye5 小时前
AI 写的 HTML 原型全是空壳?聊聊真实 DOM 交互避坑
前端·人工智能
ZANE5 小时前
纯前端实现的 PDF 与图片互相转换工具技术实现
前端
Swot5 小时前
SvelteKit Remote Functions 使用指南
前端·后端
Cooper255 小时前
三源热榜去重加 AI 摘要:URL 唯一键踩出的三个坑
前端·python
Yk酱228405 小时前
A2UI探索随笔-技术选型
前端
前端繁华如梦6 小时前
# 从 73000 行压缩代码到 TypeScript 模块化:我把一个 Three.js FPS 游戏 1:1 复刻了一遍
前端
Penge6666 小时前
React Context 详解:从 Props 传递到跨组件状态共享
前端