##这是我参与「 第五届青训营 」伴学笔记创作活动的第 2 天##
一、说在前面
这节课我们了解了 CSS 的概念和工作原理、各种 CSS 选择器以及盒模型和常用的布局方式。
二、重要知识点介绍
CSS就是一条条样式规则
CSS的概念和工作原理在这里就不详细介绍了，主要是后面的三个内容：各种CSS选择器、盒模型和常用的布局方式。
补充：在HTML中使用CSS的方法有外链、嵌入和内联３种。（推荐外链：分工 使内容、样式分离）
各种CSS选择器
selector的作用、功能：
1.通配选择器 *
代码：通配选择器 - 码上掘金 (juejin.cn)
2.id选择器 设置一个id
例如：id="logo" 则用“ #logo ”进行选择
3.类选择器
常用class去设置
例如：class=“done”,则用“ .done ”进行选择
4.以状态进行选择
例如： 密码输入错误的状态，用“ [disabled] ”进行选择
输入密码状态，用“input[type="password"]”进行选择
选择链接，，“a[href^="#"]”，href^=指href属性的开头，href$=指href属性的结尾
5.伪类pseudo-classes
盒模型
常用的布局方式
Layout
布局相关技术有：常规流、浮动和绝对定位，但重点是常规流。
常规流
1.行级
2.块级
3.表格布局
4.Flex Box
5.Grid布局
三、思维导图整理
四、课后个人感想
CSS的知识点比HTML的多了好多，，感觉有点吃不消了，还是要多多复习呀！代码也比之前复杂了好多，还没上手操作，时间好紧张😥，加油加油加油！！！！（老师说，就算再多三节课，CSS的内容也不一定讲得完🙃，还是要自己多多去学习）
五、学习资料补充
学习链接： CSS 中的一些基础概念
developer.mozilla.org/zh-CN/docs/…
课后资料：
-
W3C CSS 相关的规范 www.w3.org/TR/?tag=css
-
CSS 相关文章 web.dev/learn/css/
七、参考引用
【前端专场 学习资料一】第五届字节跳动青训营 - 掘金 (juejin.cn)
