2019-10-02 23:25:23 +08:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
## 前言
|
|
|
|
|
|
|
|
|
|
css 进阶的主要内容如下。
|
|
|
|
|
|
2019-10-03 21:36:31 +08:00
|
|
|
|
### 1、html 和 css 基础知识回顾
|
2019-10-02 23:25:23 +08:00
|
|
|
|
|
|
|
|
|
- html 元素的分类和特性
|
|
|
|
|
|
2019-10-03 21:36:31 +08:00
|
|
|
|
- css 选择器
|
2019-10-02 23:25:23 +08:00
|
|
|
|
|
2019-10-03 22:49:06 +08:00
|
|
|
|
- css 常见属性(非布局样式)
|
2019-10-02 23:25:23 +08:00
|
|
|
|
|
|
|
|
|
### 2、css 布局相关
|
|
|
|
|
|
2019-10-03 22:49:06 +08:00
|
|
|
|
- css 布局属性和组合解析
|
2019-10-02 23:25:23 +08:00
|
|
|
|
|
2019-10-03 22:49:06 +08:00
|
|
|
|
- 常见布局方案
|
2019-10-02 23:25:23 +08:00
|
|
|
|
|
|
|
|
|
- 三栏布局案例
|
|
|
|
|
|
|
|
|
|
- 各网站布局方案拆解
|
|
|
|
|
|
|
|
|
|
### 3、动画和效果
|
|
|
|
|
|
|
|
|
|
> 属于 css 中最出彩的内容。
|
|
|
|
|
|
|
|
|
|
- 多背景多投影特效
|
|
|
|
|
|
|
|
|
|
- 3D特效编写实践
|
|
|
|
|
|
|
|
|
|
- 过渡动画和关键帧动画实践
|
|
|
|
|
|
|
|
|
|
- 动画细节和原理深入解析
|
|
|
|
|
|
|
|
|
|
### 4、框架集成和 css 工程化
|
|
|
|
|
|
|
|
|
|
- 预处理器作用和原理
|
|
|
|
|
|
|
|
|
|
- less/sass 代码实践
|
|
|
|
|
|
|
|
|
|
- Bootstrap 原理和用法
|
|
|
|
|
|
|
|
|
|
- css 工程化的的实践方式
|
|
|
|
|
|
|
|
|
|
- js 框架中的 css 集成实践
|
|
|
|
|
|
2019-10-06 15:51:08 +08:00
|
|
|
|
|
2019-10-02 23:25:23 +08:00
|
|
|
|
## 常见问题
|
|
|
|
|
|
2019-10-03 22:49:06 +08:00
|
|
|
|
> 不会 css 的前端称之为伪前端。
|
2019-10-02 23:25:23 +08:00
|
|
|
|
|
2019-10-06 15:51:08 +08:00
|
|
|
|
|
|
|
|
|
### Vue 中模拟Scoped CSS的方式
|
|
|
|
|
|
|
|
|
|
方案一:随机选择器。css modules。
|
|
|
|
|
|
|
|
|
|
方案二:**随机属性**。`<div abcd>`、`div[adcd]{}`
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
### 其他问题
|
|
|
|
|
|
2019-10-05 11:59:34 +08:00
|
|
|
|
- html 元素的嵌套关系是怎么确定的?哪些嵌套不可以发生?
|
2019-10-02 23:25:23 +08:00
|
|
|
|
|
2019-10-03 22:49:06 +08:00
|
|
|
|
- 比如说,为什么 div 可以放在 a 标签里面?
|
2019-10-02 23:25:23 +08:00
|
|
|
|
|
|
|
|
|
- css 选择器的权重是如何计算的?写代码时要注意什么?
|
|
|
|
|
|
|
|
|
|
- 浮动布局是怎么回事?有什么优缺点?国内用的多吗?
|
|
|
|
|
|
|
|
|
|
- css 可否做逐帧动画吗?性能如何?
|
|
|
|
|
|
|
|
|
|
- Bootstrap 怎么做响应式布局?
|
|
|
|
|
|
|
|
|
|
- 如何解决 css 模块化过程中的选择器互相干扰的问题?
|
|
|
|
|
|
2019-10-05 11:59:34 +08:00
|
|
|
|
## 总结
|
2019-10-02 23:25:23 +08:00
|
|
|
|
|
2019-10-05 11:59:34 +08:00
|
|
|
|
单独看 css 属性并不难,难的是需要把这些思路和思想,想到它的应用场景。
|
2019-10-02 23:25:23 +08:00
|
|
|
|
|