这是我参与「第五届青训营 」伴学笔记创作活动的第 1 天
了解CSS
js（行为） CSS（样式） HTML（内容）
`h1{-------------选择器selector
color:white;--------选择器property和属性值value
font-size:14px;--------声明declaration
}`
外链
外部引用css样式
<link rel="stylesheet" href="/assets/style.css">
嵌入
将样式代码嵌套进标签里 `
li{margin:0;list-style:none;}
p{margin:lem0;}
`
内联
把标签样式直接写在style属性表
<p style="margin:lem 0">Example Content</p>
css如何工作
加载HTML→解析HTML →加载CSS→解析CSS→添加样式到DOM节点 →创建DOM树→展示页面
选择器 Selector
找出页面中的元素，以便给他们设置样式使用多种方式选择元素
按照标签名、类名或id
按照属性
按照DOM树中的位置
通配选择器
`* {
}`
标签选择器
id选择器
有一个id就可以使用id进行选中，id最好是唯一值
类选择器
class
属性选择器
以input举例：在输入密码时，使用[disable]就可以键入
伪类
不基于标签和属性定位元素
几种伪类：状态伪类；结构性伪类
组合
直接组合 AB 满足A同时满足B input:focus
后代组合 A B 选中B，如果它是A的子孙 nav a
亲子组合 A>B 选中B，如果它是A的子元素 section>p
兄弟选择器 A~B 选中B，如果它在A后且和A同级 h2~p
相邻选择器 A+B 选中B，如果它紧跟在A后面 h2+p
选择器组
用逗号把选择器分开
颜色-RGB
rgb(255,255,255) #8f(红)ac(绿)87(蓝)
颜色-HSL
hsl（360，100%，100%）
alpha-透明度
rgba(255,255,255,1)
字体font-family
使用web fonts 从浏览器上下载一个字体，从而适配所有设备环境，但是会产生一些占用
font-size
关键字：small,medium,large 长度：px,em 百分数：相对于父元素字体大小
line-height
white-space
normal 多个空格只显示一个 nowrap 不换行，强制同一行显示 pre 自动换行 pre-warp 即使有空格，显示不下连带空格一起换行 pre-line 代码中换行就会在页面上换行
调试CSS
右键点击页面，选择检查
使用快捷键
Ctrl+Shift+I
Cmd+Opt+I
整体来说目前的课程还是以基础为主，没有太深太复杂的只是，都是一些用语规范的内容。
标题：走进前端技术栈 - CSS - 掘金
