Angular Vue React 框架中的 CSS
框架中的 CSS
Angular Vue React 三大框架
Angular Vue 内置样式集成
React 一些业界实践
Angular . js (1.x)：没有样式集成能力
Angular （2+）：提供了样式封装能力 2.与组件深度集成
ShadowDOM（谈一谈神奇的ShadowDOM）：1.逻辑上一个DOM 2.结构上存在子集结构
Scoped CSS （Scoped CSS规范）：1.限定了范围的CSS 2.无法影响外部元素 3.外部样式一般不影响内部 4.可以通过 /deep 或 >>> 穿透
达到封装效果：模拟 Scoped CSS 方案1.随机选择器（不支持）2.随机属性 <div abc>----div[abc]{ }
Vue
模拟 Scoped CSS 方案1.随机选择器 css modules 2.随机属性 <div abc>----div[abc]{ }
React （React入门教程）
官方没有集成方案
社区方案：1. css modules （需要自己编译，将 class name 放到结构中） 参见博客
2.(babel) react-css-modules (正常写 class 即可）
3.styled components (将组件和样式封装到一起，变成带有样式的组件）
4.styled jsx （直接在 jsx 中写样式，简单粗暴）
