这是我参与「第五届青训营」伴学笔记创作活动的第 1 天

CSS

属性

box-sizing:inherit;把不可继承的（box-sizing）变成可继承的。

初始值

CSS中，每个属性都有一个初始值
（1）background-color 初始值为transparent
（2）margin-left初始值为0
可以使用initial关键字显式重置为初始值
（1）background-color ：initial

CSS求值过程

DOM树+样式规则————>filtering——声明值——>cascading——层叠值——>defaulting——指定值——>resolving——计算值——>formatting——使用值——>constraining——>实际值

布局

常规流：行级，块级，表格布局，FlexBox,Grid布局
浮动
绝对定位

flex

flex:1 flex-grow:1
flex:100px flex-basis:100px
flex:2 1 flex-grow:2;flex-shrink:1
flex:1 100px flex-grow:1 flex-basis:100px
flex:2 0 100px flex-grow:2;flex-shrink:0;flex-basis:100px
flex:auto flex:1 1 auto\ flex:none flex:0 0 auto

绝对定位 position属性

static 默认值
relative 相对自身原本位置偏移，不脱离文档流
absolute 绝对定位，相对最近的非static祖先元素定位
fixed 相对于视口绝对定位，脱离常规流。

Javascript

封装组件----处理UI

重构：插件化

将控制元素抽取成插件
插件和组件之间从在依赖关系

重构：模板化

解耦，
将html模板化，易于扩展

重构：抽象（组件框架）

将组件通用模型抽象出来。

实现组件的步骤：结构设计，展现效果，行为设计
三次重构。

过程抽象

用来处理局部细节控制的一些方法
函数式编程思想的基础应用

高阶函数 ——HOF

以函数作为参数；以函数作为返回值；常用于作为函数装饰器。
纯函数：输入输出是确定的。纯函数越多，越好维护。

Once:为了能够让只执行一次的需求覆盖不同的事件处理，我们可以将这个需求刨离出来，过程称为过程抽象。
Throttle:节流函数
Debounce：防抖
consumer/2:间隔时间间隔执行
Iterative:可迭代方法

编程范式

命令式（强调怎么做）与声明式（更简洁，强调做什么）。\

CSS&&Javascript|青训营笔记

CSS

属性

初始值