react第二天学习笔记

1.react中css样式的使用方式

　　1)jsx内嵌样式(这第一个大括号表示要在jsx中写js,第二个表示js对象)

　　　　<li style = {{color : '#FF0'}}>jsx内嵌样式</li>

　　2)使用className在通过css文件控制样式

　　　　<li className = 'Red'>使用className在通过css控制样式</li>

　　3)当有多个className时,也就是有多重特征时,可以从npm中下载classnames,因为classNames为方法　　　

　　　　<li className = {classNames("a",{b:true,c:false})}></li>

　　4)使用styled-components在原有元素的样式上包装成新的样式(扩展元素名都需要大写,且第一种表示为模板字符串``,不是引号)

　　　　const Title = styled.h1`

　　　　　　color : #F00;

　　　　`

　　　　const Button = styled.button({

　　　　　　color: 'grey',

　　　　});

　　　　<Title />