CSS语法规则与布局

December 21, 2020

结合之前对 CSS 知识框架的整理,这周末把语法规则和布局全部梳理了一遍。

学习思路如下:

语法规则方面主要是:选择器、单位、@rules,直接过了一遍 MDN,其实常用也就那几个。

Layout 先看的CSS Layout,短小精悍,半小时就能搞定。

Flexbox 和 Grid 都看的CSS Tricks,写得真的不错!第一遍边看边写,第二遍就把它整理下来。

一共整理了四张 XMind: 语法规则、Layout、Flexbox、Grid,其中 Layout 里面主要是传统的布局方案,而 Flexbox 和 Grid 是单独拿出来讲的。

post-css-layout

Layout

post-css-flexbox

Flexbox

post-css-grid

Grid

post-css-rules

CSS Rules

接下来就把常用的样式再整理分类一下,然后 CSS 动画得系统的再学一下