React中如何引入CSS？

React是一个流行的JavaScript库，用于构建用户界面。在React中，可以使用多种方式来引入样式表，包括内联样式、CSS模块和CSS文件。下面将介绍这些不同的方法。

1. 内联样式：
   在React中，可以使用内联样式来为元素添加样式。内联样式是通过JavaScript对象来定义的，其中键表示CSS属性，值表示属性的值。

   import React from 'react';
   
   const MyComponent = () => {
     const styles = {
       color: 'red',
       fontSize: '16px',
       fontWeight: 'bold'
     };
   
     return <div style={styles}>Hello World</div>;
   };
   
   export default MyComponent;
   ```
   
   在上面的例子中，我们定义了一个名为`styles`的对象，其中包含了一些CSS属性和对应的值。然后，将这个对象作为`style`属性的值传递给`div`元素，从而将样式应用到该元素上。
   
   

2. CSS模块：
   CSS模块是一种在React中使用的模块化CSS解决方案。它允许将CSS样式与组件进行关联，并确保样式仅在组件范围内生效，避免了全局样式的冲突问题。

   首先，需要确保项目的构建工具（如Webpack）已经配置了对CSS模块的支持。然后，在组件文件夹中创建一个CSS文件，并使用.module.css作为文件后缀，以指示它是一个CSS模块。