React組件怎么寫CSS？

React組件是一種用于構(gòu)建用戶界面的JavaScript庫，而CSS則是用于描述網(wǎng)頁外觀和布局的語言，在React中，我們可以通過import語句引入CSS文件，然后在組件中使用className屬性來應(yīng)用CSS樣式。

我們需要創(chuàng)建一個CSS文件，并編寫相應(yīng)的樣式規(guī)則，我們可以編寫一個名為“myComponent.css”的CSS文件，并定義一些樣式規(guī)則，如顏色、字體大小、邊框等。

我們需要在React組件中引入這個CSS文件，可以通過import語句來實現(xiàn)，

import React from 'react';
import './myComponent.css';

在組件中使用className屬性來應(yīng)用CSS樣式。

function MyComponent() {
  return (
    <div className="my-component">
      <h1 className="my-component-title">Hello, World!</h1>
    </div>
  );
}

在上面的代碼中，我們定義了一個名為“MyComponent”的React組件，并在其中使用了一個div元素和一個h1元素，我們通過className屬性將“my-component”和“my-component-title”這兩個CSS類應(yīng)用到這兩個元素上，以控制它們的外觀和布局。

我們需要在React應(yīng)用程序中渲染這個組件，并在瀏覽器中查看效果，可以看到，我們的組件已經(jīng)成功應(yīng)用了CSS樣式，并呈現(xiàn)出相應(yīng)的外觀和布局。

React組件與CSS的結(jié)合使用可以讓我們更加方便地控制網(wǎng)頁的外觀和布局，通過編寫相應(yīng)的CSS文件并在組件中應(yīng)用className屬性，我們可以輕松地實現(xiàn)各種樣式的應(yīng)用。