技术栈

css 如何根据子元素给他的父元素设置样式

夏天想2024-10-24 20:05

<div class="parent">

<div :class="{ flag ? 'active' : 'unactive' }">子元素啊根据一个变量来加样式</div>

</div>

这个时候如何根据子元素来给这个parent加样式呢?

其中能马上想到的就是:这个class的判断可以加在parent后面,但是如果不改变外层内容只是修改css呢。

这个时候我们可以用到:has

.parent:has(.active){

color:red;

}
.parent:has(.unactive){

color:yellow;

}

上一篇:c++ pdf文件提取txt文本示例
下一篇:ansible批量部署apache
相关推荐
懂懂tty
29 分钟前
CRA 迁移 Rspack(实战)
前端·架构
小码哥_常
2 小时前
Kotlin 助力 Android 启动“大提速”
前端
GreenTea
2 小时前
AI 时代,工程师的不可替代性在哪里
前端·人工智能·后端
Jagger_
2 小时前
能不能别再弄低代码害人了
前端
朦胧之
2 小时前
AI 编程开发思维
前端·后端·ai编程
踩着两条虫
3 小时前
VTJ:快速开始
前端·低代码·架构
木斯佳
4 小时前
前端八股文面经大全:携程前端一面(2026-04-17)·面经深度解析
前端·状态模式
Java后端的Ai之路
4 小时前
LangChain ReAct Agent 核心技术问答
前端·react.js·langchain
码喽7号
4 小时前
Vue学习七:MockJs前端数据模拟
前端·vue.js·学习
NotFound486
5 小时前
探究分享从对话到执行:OpenTiny NEXT 如何重塑前端智能化开发范式
前端
热门推荐
012026年4月技术前沿:AI大模型爆发、智能体革命与量子安全新纪元02GitHub 镜像站点032026 年 AI 编程助手全面对比评测:Cursor vs Copilot vs Claude Code vs GitHub Copilot Free04Claude Code Windows 兼容性问题:指定版本 2.1.112 可解决05UBUNTU Claude Code 报错 claude native binary not installed06AI Weekly | 2026年4月第二周 · GitHub热门项目与AI发展趋势深度解析07从限购到畅通:GLM-5.1 Coding Plan接入攻略08GPT-6发布日深度解析-Symphony架构200万Token实战09从零部署 Hermes Agent:一只"会成长的 AI 马"保姆级安装教程10零成本!Ollama本地部署国产大模型全指南(支持Kimi-K2.5/GLM-5/Qwen,新手秒上手)