码迷,mamicode.com
首页 > Web开发 > 详细

React 中使用CSS的方法

时间:2020-01-12 22:22:57      阅读:142      评论:0      收藏:0      [点我收藏+]

标签:const   需要   span   extends   test   javascrip   没有   sni   context   

 

不需要组件从外部引入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对象中不变。

React 中使用CSS的方法

标签:const   需要   span   extends   test   javascrip   没有   sni   context   

原文地址:https://www.cnblogs.com/jyczzp/p/12184837.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!