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

相关推荐
浅念-几秒前
C ++ 智能指针
c语言·开发语言·数据结构·c++·经验分享·笔记·算法
今儿敲了吗2 分钟前
python基础学习笔记第七章——文件操作
笔记·python·学习
GISer_Jing5 分钟前
两种AI交互方式深度解析——浏览器书签&插件
前端·人工智能·ai·prompt
前端布鲁伊15 分钟前
零代码上线一个图片处理网站,我是如何使唤AI干活的?
前端·ai编程
庄小焱16 分钟前
React——React基础语法(2)
前端·javascript·react.js
终端鹿19 分钟前
Vue3 核心 API 深度解析:ref / reactive / computed / watch
前端·javascript·vue.js
console.log('npc')25 分钟前
partial在react接口定义中是什么意思
前端·javascript·typescript
SuperEugene26 分钟前
前端 utils 工具函数规范:拆分 / 命名 / 复用全指南,避开全局污染等高频坑|编码语法规范篇
开发语言·前端·javascript
Yu_Lijing29 分钟前
基于C++的《Head First设计模式》笔记——生成器模式
c++·笔记·设计模式