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

相关推荐
phltxy15 小时前
Vue 核心特性实战指南:指令、样式绑定、计算属性与侦听器
前端·javascript·vue.js
Byron070716 小时前
Vue 中使用 Tiptap 富文本编辑器的完整指南
前端·javascript·vue.js
css趣多多16 小时前
地图快速上手
前端
zhengfei61117 小时前
面向攻击性安全专业人员的一体化浏览器扩展程序[特殊字符]
前端·chrome·safari
一只小小的芙厨17 小时前
寒假集训笔记·树上背包
c++·笔记·算法·动态规划
码丁_11717 小时前
为什么前端需要做优化?
前端
Mr Xu_17 小时前
告别硬编码:前端项目中配置驱动的实战优化指南
前端·javascript·数据结构
深蓝海拓17 小时前
PySide6从0开始学习的笔记(二十七) 日志管理
笔记·python·学习·pyqt
xqqxqxxq18 小时前
Java Thread 类核心技术笔记
java·笔记
Byron070718 小时前
从 0 到 1 搭建 Vue 前端工程化体系:提效、提质、降本实战落地
前端·javascript·vue.js