引入方法有：1、行內(nèi)樣式；2、聲明樣式，行內(nèi)樣式類似，區(qū)別只是聲明一個(gè)變量保存樣式表綁定給style屬性；3、import引入，React組件一般是一個(gè)文件夾，文件夾里包含對(duì)應(yīng)的js和css，只要在js中引入同級(jí)的css即可。

本教程操作環(huán)境：windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。

<div style="color:red">測試數(shù)據(jù)</div> //報(bào)錯(cuò)

在React中，如果直接按上面的方式寫內(nèi)聯(lián)樣式會(huì)直接報(bào)錯(cuò)，因?yàn)镴SX語法不支持，React支持以下三種寫css的方法：

1.行內(nèi)樣式

... <div style={{     width:'200px',     height:'80px',     backgroundColor:'yellow',    　　　　     fontSize:'24px',    　　　　     textAlign:'center'   　　　　 }}>測試數(shù)據(jù)</div> ...

2.聲明樣式

聲明樣式和行內(nèi)樣式類似，區(qū)別只是聲明一個(gè)變量保存樣式表綁定給style屬性。

... <div style={{     width:'200px',     height:'80px',     backgroundColor:'yellow',    　　　　     fontSize:'24px',    　　　　     textAlign:'center'   　　　　 }}>測試數(shù)據(jù)</div> ...

3.import引入

一個(gè)React組件一般就是一個(gè)文件夾，文件夾里包含對(duì)應(yīng)的js和css，只要在js中引入同級(jí)的css即可。

import './mystyle.css';

推薦學(xué)習(xí)：css視頻教程