伪选择器和伪元素选择器

常用伪类

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

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;
}
相关推荐
90后的晨仔14 小时前
从 H5 到 uni-app:一篇写给前端小白的"翻译指南"
前端·vue.js·前端框架
陈随易14 小时前
moon,apt和yum之外linux系统命令安装新选择
前端·后端·程序员
IT小盘15 小时前
13-企业Prompt模板-角色任务约束与输出格式
java·前端·prompt
徐小夕15 小时前
开源!我用SQLite + DuckDB打造了一款可视化AI问数平台
前端·算法·github
leslie11816 小时前
babel笔记
前端
用户0595401744616 小时前
Redis 记忆存储踩坑实录:一个并发写入 Bug 让我排查了 4 小时
前端·css
小徐_233317 小时前
Wot UI 2.3.0 发布:二维码组件来了,Open Wot 与 wot-starter 同步更新
前端·微信小程序·uni-app
kyriewen17 小时前
Claude自己跑出去hack了3家公司——我为什么还在用它写代码
前端·ai编程·claude
IT_陈寒17 小时前
SpringBoot自动配置的坑,这次真踩疼我了
前端·人工智能·后端
子兮曰17 小时前
AI 浏览器 Agent 的安全困局:当自动化工具可以偷走你的登录态
前端·人工智能·后端