技术栈

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
相关推荐
百万蹄蹄向前冲
几秒前
支付宝 VS 微信 小程序差异
前端·后端·微信小程序
兆子龙
4 分钟前
JavaScript 的 Symbol.iterator:手写一个可迭代对象
前端
NGC_6611
4 分钟前
ArrayList扩容机制
java·前端·算法
独泪了无痕
5 小时前
使用Fetch API 探索前后端数据交互
前端·http·交互设计
css趣多多
6 小时前
别名路径的知识点
前端
靓仔建
7 小时前
Vue3导入组件出错does not provide an export named ‘user_setting‘ (at index.vue:180:10)
开发语言·前端·typescript
EnoYao
8 小时前
我写了一个团队体检报告 Skill,把摸鱼的同事扒出来了😅
前端·javascript
梁正雄
8 小时前
Python前端-2-css练习
前端·css·python
清汤饺子
8 小时前
用 Cursor 半年了,效率还是没提升?是因为你没用对这 7 个功能
前端·后端·cursor
热门推荐
01GitHub 镜像站点02OpenClaw 使用和管理 MCP 完全指南03本地部署 OpenClaw + DeepSeek-R1 完全指南04Qwen3.5 开源全解析:从 0.8B 到 397B,代际升级 + 全场景选型指南05OpenClaw 飞书机器人不回复消息?3 小时踩坑总结06OpenClaw macOS 完整安装与本地模型配置教程(实战版)07得物前端部门,没了08OpenClaw 连接飞书完整指南:插件安装、配置与踩坑记录09Window 10部署openclaw报错node.exe : npm error code 12810OpenClaw 接入 QQ Bot 完整实践指南