react知识点学习（一）——定义CSS样式

本文转载自：

React入门到精通（三）——定义组件和css样式

方法一：内部样式

<h1 style={styleObj} className="alert-text">Hello {this.props.name} {this.props.title}</h1>;

<style>
        .alert-text{
            font-size: 20px;
        }
    </style>

需要注意的是，react引用js文件，type="text/babel" ，并且要设置DOM元素的class，应该写className=" "而不是class=" "。

方法二：内联样式

{/*style={{color:'red'}}*/}

对于不用的CSS属性，均用{}单独括起来。

方法三：在JSX中定义样式对象

 var styleObj = {
            color:"blue",
            fontSize:40,
            fontWeight:"normal"
        } 

通过表达式的形式来引用CSS

style={styleObj}