css 练习笔记1

1.css嵌套/后代选择

语法:

css 复制代码
.a .b{

}

或者(scss语法)

css 复制代码
.a{

    .b{

    }

}

表示 class b只有在b是定义在class a的后代元素上时才生效。

2.transform-style

https://developer.mozilla.org/zh-CN/docs/Web/CSS/Reference/Properties/transform-style

https://www.w3school.com.cn/cssref/pr_transform-style.asp

设置父元素内部是3D还是2D。

设置成flat的时候,可以看成父元素内部空间是平面的,子元素和父元素的动画效果都在同一个平面。

设置成preserve-3d的时候,可以把父元素空间想象是一个3D空间,父元素变形效果和子元素变形效果可以存在空间关系。

3.z-index

https://developer.mozilla.org/zh-CN/docs/Web/CSS/Reference/Properties/z-index

https://www.w3school.com.cn/cssref/pr_pos_z-index.asp

相关推荐
徐小夕36 分钟前
jitword 协同文档3.2发布:打造浏览器中最强word编辑器
前端·架构·github
纯爱掌门人2 小时前
干了这么多年前端,聊聊 2026 年我们到底还值不值钱
前端·程序员
houhou2 小时前
Monaco Editor 集成指南:从配置到优化
前端
hunterandroid2 小时前
[Android 从零到一] Custom View 自定义绘制:从 onDraw 到完整交互
前端
李明卫杭州2 小时前
Vue3 v-memo 指令详解:让你的列表渲染性能翻倍 🚀
前端
梨子同志2 小时前
Monorepo
前端
lihaozecq2 小时前
继 Web Coding Agent 后,我做了一个本地优先的桌面 AI Agent
前端·agent
用户298698530143 小时前
在 React 中使用 JavaScript 将 Excel 转换为 SVG
前端·javascript·react.js
CodingSpace3 小时前
ESLint
前端
Csvn3 小时前
异步错误捕获的六大陷阱:await 裹着 try-catch 就一定稳了吗?
前端