React作為最受歡迎的JavaScript庫之一，已經成為前端開發人員的首選工具之一。其中，組件是React應用程序的基本構建塊。在開發React應用程序時，我們需要使用CSS樣式來美化我們的界面。在這篇文章中，我們將介紹如何引入css文件到我們的React組件中。
首先，我們需要在React組件中引入我們的css文件。我們可以使用JSX語法中的`import`語句來完成這個任務。在我們的組件最頂部，添加以下代碼：
```pre
import './style.css';
```
上面的代碼會將`style.css`文件引入到我們的React組件中。在這里，`./`表示當前文件夾，所以如果我們的css文件在當前文件夾下，我們就可以使用上面的語句將它引入進來。
一旦我們已經引入了我們的CSS文件，我們就需要應用它到我們的組件。通常情況下，我們可以給React組件加上一個`className`屬性來指定一個CSS類。這個CSS類在CSS文件中已經定義好了樣式。舉個例子，我們可以給一個按鈕組件添加一個CSS類。代碼如下所示：
```pre
import React from 'react';
import './style.css';
function Button(props) {
return ();
}
export default Button;
```
在上面的代碼中，我們將一個CSS類`button-style`應用到了我們的按鈕組件上。在CSS文件中，我們可以為這個類添加樣式，如下所示：
```pre
.button-style {
background-color: blue;
color: white;
}
```
通過將這個CSS類應用到我們的按鈕組件上，我們可以給它添加背景色和字體顏色，并實現我們想要的樣式效果。
總結：在這篇文章中，我們學習了如何在React組件中引入CSS文件，并如何將CSS類應用到React組件中。這樣，我們就可以更好地實現我們的樣式效果，為用戶提供更好的使用體驗。
上一篇html5橢圓代碼