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对象中不变。

相关推荐