CSS 的進化： CSS Evolution: From CSS, SASS, BEM, CSS Modules to Styled Components
這里有各個方式的比較：styled-components/comparison
還有
Less 是一門 CSS 預處理語言拯腮，它擴展了 CSS 語言，增加了變量、Mixin、函數(shù)等特性辙诞，使 CSS 更易維護和擴展。Less 可以運行在 Node 或瀏覽器端
Sass 有兩種語法規(guī)則(syntaxes),目前新的語法規(guī)則（從 Sass 3開始）被稱為
“SCSS”( 時髦的css（Sassy CSS）),它是css3語法的的拓展級轻抱，就是說每一個語法正確的CSS3文件也是合法的SCSS文件飞涂，SCSS文件使用.scss作為拓展名。第二種語法別成為縮進語法（或者 Sass）祈搜，它受到了Haml的簡潔精煉的啟發(fā)较店，它是為了人們可以用和css相近的但是更精簡的方式來書寫css而誕生的。它沒有括號容燕，分號梁呈，它使用 行縮進 的方式來指定css 塊，雖然sass不是最原始的語法蘸秘，但是縮進語法將繼續(xù)被支持官卡，在縮進語法的文件以 .sass 為拓展名。
Compass is an open-source CSS Authoring Framework.
看下自己的項目現(xiàn)在進化到那個階段醋虏，階段本身無優(yōu)劣之分寻咒，不是說你用技術新，你就很厲害灰粮，不是你厲害仔涩，是人家發(fā)明這個東西的人厲害。
CSS Modules
http://www.ruanyifeng.com/blog/2016/06/css_modules.html
1粘舟，局部作用域
2熔脂，全局作用域
3，組合
4柑肴，模塊引入
.className {
background-color: blue;
}
.title {
composes: className;
color: red;
}
##another.css
.className {
background-color: blue;
}
##App.css
###demos/blob/master/demo05/components/App.css可以繼承another.css里面的規(guī)則霞揉。
.title {
composes: className from './another.css';
color: red;
}
styled Componets的demo
https://github.com/styled-components/styled-components
import React from 'react';
import styled from 'styled-components';
// Create a <Title> react component that renders an <h1> which is
// centered, palevioletred and sized at 1.5em
const Title = styled.h1`
font-size: 1.5em;
text-align: center;
color: palevioletred;
`;
// Create a <Wrapper> react component that renders a <section> with
// some padding and a papayawhip background
const Wrapper = styled.section`
padding: 4em;
background: papayawhip;
`;
// Use them like any other React component – except they're styled!
<Wrapper>
<Title>Hello World, this is my first styled component!</Title>
</Wrapper>
