react项目中，公共样式放在那个文件夹里

在React项目中，通常将公共样式文件放在`src`目录下的一个名为`styles`的文件夹中。这样做的好处是可以将所有的公共样式集中管理，方便修改和维护。

具体的操作步骤如下：

1. 在`src`目录下创建一个名为`styles`的文件夹。

2. 在`styles`文件夹中创建一个名为`index.css`的文件。

3. 在`index.css`中编写公共样式。

例如，我们可以在`index.css`中定义一个名为`container`的样式类：

.container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 20px;
}

4. 在需要使用这个样式的组件中，使用`import`语句导入`index.css`文件。

import React from 'react';
import './styles/index.css';

function App() {
  return (
    <div className="container">
      {/* 组件内容 */}
    </div>
  );
}

export default App;

这样做的好处是，所有需要使用这个样式的组件都可以直接引用这个样式类，而无需重复定义样式。同时，如果需要修改这个样式，只需要在`index.css`中进行修改，所有使用这个样式的组件都会自动更新样式。

相关问题

在react项目中public文件夹里面图片的引用方法

在 React 项目中，你可以在 public 文件夹中创建一个 images 文件夹，将你的图片文件放在里面。然后，可以使用以下代码来引用这些图片：

<img src={process.env.PUBLIC_URL + '/images/your-image-file.jpg'} alt="your image description" />

其中，`process.env.PUBLIC_URL` 会指向 public 文件夹的路径，你可以在路径后面添加你的图片文件的相对路径。例如上面的代码中，`/images/your-image-file.jpg` 指的是 public 文件夹中的 images 文件夹下的你的图片文件。

另外，如果你想要在 CSS 文件中使用图片，也可以使用相对路径来引用：

background-image: url(../images/your-image-file.jpg);

这里的 `..` 表示返回上一级目录，然后再进入 images 文件夹。

在react项目中的css文件里面使用public文件夹里面的图片

在 React 项目中，可以使用 `public` 文件夹来存储静态资源文件，比如图片。在 CSS 文件中使用这些图片，可以通过相对路径的方式来引用。假设在 `public` 文件夹中有一张名为 `image.png` 的图片，可以按照以下方式在 CSS 文件中使用：

background-image: url(../image.png);

注意，此处的 `../` 表示回到上一级目录，然后再进入 `public` 文件夹。如果图片不在 `public` 文件夹中，而是在 `src` 文件夹中的某个子目录中，可以使用相对路径来引用，例如：

background-image: url(../images/image.png);

这里的 `../` 表示回到上一级目录，然后进入 `images` 子目录。