• CSS原理与使用方式:介绍css被浏览器使用的原理与被人类使用的方式

• 基础属性：介绍一些基础的属性，比如长宽字体颜色边框边距

• 布局：介绍特殊的属性，定位元素在网页中的排布方式

CSS原理与使用方式

CSS的使用方式
行内嵌入 <div style=""> </div>
内部样式表 <style> </style>
外部样式表 <link rel="stylesheet" href="../styles/style.css">

CSS的工作原理
https://developer.mozilla.org/zh-CN/docs/Learn/CSS/First_steps/How_CSS_works

选择器
https://www.acwing.com/blog/content/16243/
https://developer.mozilla.org/zh-CN/docs/Learn/CSS/Building_blocks/Selectors

基础属性

颜色、文本、字体、背景、边框、内外边距
https://www.acwing.com/blog/content/16274/
https://www.acwing.com/blog/content/16275/
https://www.acwing.com/blog/content/16276/
https://www.acwing.com/blog/content/16277/
https://www.acwing.com/blog/content/16278/
https://www.acwing.com/blog/content/16280/

布局

布局的概念
https://developer.mozilla.org/zh-CN/docs/Learn/CSS/CSS_layout/Introduction

嵌套元素展现形式、盒子模型、元素在文档中的定位方式
https://www.acwing.com/blog/content/16279/
https://developer.mozilla.org/zh-CN/docs/Web/CSS/box-sizing
https://www.acwing.com/blog/content/16282/
https://developer.mozilla.org/zh-CN/docs/Web/CSS/position

flex容器、网格
https://developer.mozilla.org/zh-CN/docs/Learn/CSS/CSS_layout/Flexbox
https://developer.mozilla.org/zh-CN/docs/Learn/CSS/CSS_layout/Grids

响应式布局
https://developer.mozilla.org/zh-CN/docs/Learn/CSS/CSS_layout/Responsive_Design#%E5%93%8D%E5%BA%94%E5%BC%8F%E8%AE%BE%E8%AE%A1
https://developer.mozilla.org/zh-CN/docs/Learn/CSS/CSS_layout/Media_queries