摘要：
框架中的 CSS Angular Vue React 三大框架 Angular Vue 内置样式集成 React 一些业界实践 Angular Angular . js (1.x)：没有样式集成能力 Angular （2+）：提供了样式封装能力 2.与组件深度集成 ShadowDOM（谈一谈神奇的S 阅读全文
摘要：
CSS 工程化 组成：1.组织 （代码目录）2.优化（那种实现方式更好） 3.构建（代码完成后需要经过哪些处理步骤） 4.维护 常见问题 1.如何解决 CSS 模块化问题 1.Less Sass 等CSS 预处理器 2.PostCSS 插件 （postcss-import / precss 等） 3 阅读全文
摘要：
Bootstrap 小结 Bootstrap4特点：1.兼容IE10+ 2.使用flexbox 布局 3.抛弃Nomalize.css 4.提供布局和 reboot 版本 Bootstrap组成：1.基础样式 2.常用组件 3.JS插件 常见问题： 1.Bootstrap 的优缺点 优点：CSS 代 阅读全文
摘要：
CSS 预处理器框架 可以按照需求来使用别人的代码 1.sass (compass) 2.less (lesshat/EST) 3.提供现成的 mixin 4.类似 JS 类库 ，封装常用功能 css 预处理器常见问题（详细讲解见上篇博客） 1.常见的 css 预处理器 1.Less(Node.js 阅读全文
摘要：
CSS预处理器 1.基于CSS的另一种语言 2.通过工具编译成CSS 3.添加了很多CSS不具备的特性 4.能提升CSS文件的组织 提供功能：1.嵌套 反映层级和约束 2.变量和计算，减少重复戴拿 3.Extend 和 Mixin 代码片段 4.循环 适用于复杂有规律的样式 5.import CSS 阅读全文
摘要：
CSS动画 原理：1.画面之间变化 2.视觉暂留作用 常见问题 1.CSS 动画的实现方式有几种 1.transition 2. keyframes(animation) 2.过渡动画和关键帧动画的区别 1.过渡动画需要状态变化 2.关键帧动画不需要状态变化 3.关键帧动画能控制更精细 3.如何使用 阅读全文
摘要：
详细解答参见上篇博客 问题1.如何用 div 画一个 xxx box-shadow 无限投影 (堆叠成复杂图案） ::before ::after 问题2.如何产生不占空间的边框 1.box-shadow 2.outline 问题3.如何实现圆形元素（头像） border-radius:50% 问题 阅读全文
摘要：
效果属性 1.box-shadow（盒子阴影） 示例 加上 box-shadow 内阴影 复杂例子 阴影的形状跟原来的形状是一样的 结果： box-shadow 作用：1.营造层次感（立体感）2.充当没有宽度的边框（没有大小，不会占据位置）3.特殊效果 2.text-shadow（文本阴影） 作用： 阅读全文
摘要：
CSS（非布局样式） 问题1.CSS样式（选择器）的优先级 1.计算权重 2.！important 3.内联样式比外嵌样式高 4.后写的优先级高 问题2.雪碧图的作用 1.减少 HTTP 请求数，提高加载性能 2.有一些情况下可以减小图片大小 问题3.base64 的使用 1.用于减少 HTTP 请 阅读全文
摘要：
CSS（选择器） 作用：用于匹配 HTML 元素 选择器分类： 1.元素选择器 a{} 2.伪元素选择器 ::before{} （真实存在的元素） 3.类选择器 .link{} 4.属性选择器[type=radio]{} 5.伪类选择器 :hover （一种状态，不是真实存在的） 6.ID选择器 # 阅读全文