JSX的样式处理

1. 行内样式--style

<h1 style={{ color:'red', backgroundColor:'skyblue' }}>
    JSX的样式处理
</h1>

2. 类名--className(推荐)

index.js

//1. 导入react
import React from 'react';
import ReactDOM from 'react-dom';


//引入css
import './index.css'



const list = (
  <h1 className="title" style={{ color:'red', backgroundColor:'skyblue' }}>
    JSX的样式处理
  </h1>
)



// 渲染react元素
ReactDOM.render(list, document.getElementById('root'))

index.css

.title {
  text-align: center;
}