React 中使用CSS的方法

 

不需要组件从外部引入css文件，直接在组件中书写。

import React, { Component } from "react";const div1 = {  
　　width: "300px", 
　  margin: "30px auto",  
　　backgroundColor: "#44014C",  //驼峰法  
　　minHeight: "200px",  
　　boxSizing: "border-box"};
　　
class Test extends Component {  
　　constructor(props, context) {    
　　　　super(props);  
}  
　　render() {    
　　　　return (     
　　　　　　<div>       
　　　　<div style={div1}>123</div>       
　　　　<div style="background-color:red" >　　     
　　</div>    
　　);  
　}
}
export default Test;


注意事项:
在正常的css中，比如background-color，box-sizing等属性，在style对象div1中的属性中，必须转换成驼峰法
backgroundColor，boxSizing。而没有连字符的属性，如margin，width等，则在style对象中不变。