前端学习笔记

字体图标、SVG图标 字体的原理 当浏览器读到文字的时候会转换成对应的unicode（可认为是世界上任意一种文字的特定编号）码。根据font-family查找电脑离对应的字体文件，再根据unicode

what is Grid 是一种二维布局模型，先在页面上画好“虚拟格子”，再设置元素在格子上的位置和跨度 、 相关概念 Grid Container 容器 Grid item 容器内的元素 Grid

是什么 弹性布局，是一种一维布局模型 一维，即线性布局，所有要布局的元素都会穿在一根线上，如图 布局的参与者：1.容器container 2.多个子项item 如何设置flex： 上面，父容器的dis

定位 让元素在一定程度上摆脱普通流的约束，放置在任意位置，对其它元素不受影响 定位有五个属性，四个值 position：static、relative、absolute、fixed、sticky to

外边距折叠 块级元素的上外边距和下外边距有时候会合并为一个外边距，其大小取于其中的最大者 上图中，header和main的上下间距是20px，main和footer之间的间距是30px 嵌套折叠 如果

布局模式：基于盒子与其兄弟和祖辈盒子的交互方式来确定盒子的位置和大小的算法 普通类(Normal flow)：什么都不做，不对元素位置作变动，就是普通流 表格布局，仅用于设置表格 浮动布局，用来让元素

css样式优先级：不同的 优先级顺序大原则：!important > 内联样式 > 选择器设置样式 > 浏览器默认样式 > 继承样式 如果优先级相同，后面的覆盖前面的 CSS选择器权重计算 千位： C

CSS引入 link引入—在html中用这样一行代码引入css文件 <link rel="stylesheet" href="css的地址"> 把CSS放进style标签里 使用@import 引入C

块级元素的上外边距和下外边距有时候会合并为一个外边距，其大小取于其中的最大者 上图中，header和main的上下间距是20px，main和footer之间的间距是30px 嵌套折叠 如果在父元素与其