您好,登錄后才能下訂單哦!
本篇內容介紹了“react怎么引入css”的有關知識,在實際案例的操作過程中,不少人都會遇到這樣的困境,接下來就讓小編帶領大家學習一下如何處理這些情況吧!希望大家仔細閱讀,能夠學有所成!
引入方法有:1、行內樣式;2、聲明樣式,行內樣式類似,區別只是聲明一個變量保存樣式表綁定給style屬性;3、import引入,React組件一般是一個文件夾,文件夾里包含對應的js和css,只要在js中引入同級的css即可。
本教程操作環境:windows7系統、CSS3&&HTML5版、Dell G3電腦。
<div style="color:red">測試數據</div> //報錯
在React中,如果直接按上面的方式寫內聯樣式會直接報錯,因為JSX語法不支持,React支持以下三種寫css的方法:
1.行內樣式
... <div style={{ width:'200px', height:'80px', backgroundColor:'yellow', fontSize:'24px', textAlign:'center' }}>測試數據</div> ...
2.聲明樣式
聲明樣式和行內樣式類似,區別只是聲明一個變量保存樣式表綁定給style屬性。
... <div style={{ width:'200px', height:'80px', backgroundColor:'yellow', fontSize:'24px', textAlign:'center' }}>測試數據</div> ...
3.import引入
一個React組件一般就是一個文件夾,文件夾里包含對應的js和css,只要在js中引入同級的css即可。
import './mystyle.css';
“react怎么引入css”的內容就介紹到這里了,感謝大家的閱讀。如果想了解更多行業相關的知識可以關注億速云網站,小編將為大家輸出更多高質量的實用文章!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。