请让我知道如何链接这个反应到css文件

Question

我是html/css的新生。因为我最近刚学习了html/css，所以我在学习的时候遇到了一些问题。

我只是想链接这个React文件到我的css文件，但我不知道如何即使我搜索所有的方法，我可以使它。

(1) React文件

import styled, { keyframes } from "styled-components";
const Flow = () => {
return (
<Container>
<FlowBox>
<FlowWrap>
<Flow>
<span>King of pirates</span>
<span>King of pirates</span>
<span>King of pirates</span>
<span>King of pirates</span>
</Flow>
</FlowWrap>
</FlowBox>
</Container>
)
}
export default AboutFlow;
const Container = styled.div`
margin:100px 0 0 0;
border-top:1px solid #000;
border-bottom: 1px solid #000;
`
const flowing = keyframes`
0% {
transform: translate3d(0, 0, 0);
}
100% {
transform: translate3d(-50%, 0, 0);
}
`
const FlowBox = styled.div`
position: relative;
width: 100%;
height: 250px;
overflow: hidden;
`
const FlowWrap = styled.div`
display: flex;
top: 0;
left: 0;
align-items: center;
width: 100%;
height: 100%;
white-space: nowrap;
`

const Flow = styled.div`
font-size: clamp(15px, 10vw, 8rem);
animation: ${flowing} 8s linear infinite;
span{
display:inline-block;
font-weight:600;
padding:0 20px;
}

(2)我的CSS文件

@import "./react.css";
.title{
background-image: url(../src/img/upper_blackbar_edit.png);
min-width: 1000px;
background-size:100% 50px;
}
.bg{
width:100%;
min-width: 1000px;
}
.logo{
height:50px;
vertical-align: top;
}
.map{
min-width: 100%;
width: 80%;
object-fit: cover;
display: block;
top:10%;
margin:auto;
}

.body{
min-width: 1000px;
background-image: url(../src/img/background.png);
background-size:cover;
overflow: scroll;
} 

我怎么能看到我的css文件链接到这个反应文件?请帮帮我。

我需要一些具体的方法来做这件事。

Answer 1

import '(your css file path)';
const Flow = () => {
return (
<Container className="(name your class)">
<FlowBox className="(name your class)">
<FlowWrap className="(name your class)">
<Flow>
<span className="(name your class)">King of pirates</span>
<span className="(name your class)">King of pirates</span>
<span className="(name your class)">King of pirates</span>
<span className="(name your class)">King of pirates</span>
</Flow>
</FlowWrap>
</FlowBox>
</Container>
)
}

导入css文件，然后使用className，它将工作