理解CSS| 青训营笔记

64 阅读1分钟

今天这节课主要讲了部分CSS知识模块,比如布局、层叠上下文等 讲解了一些CSS生态相关的知识,提供一个简明的知识脉络。

什么是CSS呢?

CSS 是“Cascading Style Sheet”的缩写,中文意思为“层叠样式表”,它是一种标准的样式表语言,用于描述网页的表现形式(例如网页元素的位置、大小、颜色等)。

CSS 的主要作用是定义网页的样式(美化网页),对网页中元素的位置、字体、颜色、背景等属性进行精确控制。CSS 不仅可以静态地修饰网页,还可以配合 JavaScript 动态地修改网页中元素的样式,而且市面上几乎所有的浏览器都支持 CSS。

CSS简要发展历史

image.png

层叠、优先级

image.png 选择器有几个?

image.png

选择器的优先级?

image.png 选择器尽量少用id、尽量不要用!important、自己的样式加载在引用库样式的后面

继承

image.png

CSS的值和单位

image.png

盒模型

image.png

image.png

布局

常规流、弹性盒子、Grid、定位

概述

image.png

常规流布局

image.png

块级格式上下文

image.png

外边距塌陷

image.png

内联级格式化上下文

image.png

弹性盒子布局

image.png

今日总结

学习了CSS的一些理解,基础、布局、Stacking Context、变形、过度、动画、响应式设计、语言增强和工程架构等方面的知识。对我以后学习CSS有了很大的帮助,我也对CSS有了很深刻的理解。