react基础之--样式设置

1、行内样式设置

<p style = {{color:'red', fontSize:'14px'}}>{this.state.name}</p>

2、以对象的形式   将样式抽离出来 进行设置

import React from 'react'

const nameStyle = {
  fontSize: '20px',
  color: '#000',
  fontWeight: 'bold',
}

export default class Child2 extends React.Component{
  constructor(props){
    super(props)
    this.state = {
      name:'aaa'
    }
  }

  render(){
    return (
      <div>
        <p style = {nameStyle}>{this.state.name}</p>
      </div>
    )
  }
}

3、使用样式表进行设置    使用className 

<p className = 'nameStyle'>{this.state.name}</p>