styled-components

什么是style-components?

style-components是针对React写的一套css in js框架，简单来说就是在js中写css。相对于与预处理器(sass、less)的好处是，css in js使用的是js语法，不用从新再学习新技术，也不会多一道编译步骤。无疑会加快网页速度。

1. 安装

npm install --save style-components

2，在项目模块中引入

3,基本用法以下：

注意：1，定义首字母 必须大写

2，能够采用es6 模板字符串的形式

3，能够经过props的形式传值 判断true 进行样式更改

4,内部包裹的元素 仍是能够经过className的形式添加样式

5. 标签属性

使用style-components，须要使用标签属性，如input 的placeholder，a标签的href等，style-components提供了属性attrs，以下：

 

4