如何使外部自定义css（style.css）与react组件一起工作？_Css_Reactjs

如何使外部自定义css（style.css）与react组件一起工作？

css reactjs

如何使外部自定义css（style.css）与react组件一起工作？,css,reactjs,Css,Reactjs,我有一个项目正在进行中，在几个组件中，我需要放置样式。引导程序工作正常。但是当我添加style.css时，它似乎没有跟上我已经检查了页面源代码，style.css文件已正确链接到我的index.html文件我的文件结构：这是我的index.html <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=

我有一个项目正在进行中，在几个组件中，我需要放置样式。引导程序工作正常。但是当我添加

style.css

时，它似乎没有跟上

我已经检查了页面源代码，

style.css

文件已正确链接到我的

index.html

文件

我的文件结构：

这是我的

index.html

  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="theme-color" content="#000000">

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
    <link rel="stylesheet" href="%PUBLIC_URL%/style.css">
    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">

    <title>News Scroller</title>
  </head>


新闻滚动条

这取决于您的网页在编译时创建了什么？您现在是如何将react组件放入

index.html

的

似乎那些还没有出现。需要做以下几件事：

应该有一个潜水舱，你的

您的index.html不应直接引用styles.css。通常是，取决于你的名字

在style.css文件中，我错误地编写了css选择器

我以前写过：

.input group.input group sm.col-md-3

无法选择类名。

相反，我在类名和CSS规则之间替换了“”。

我认为您需要实现**scss**以便在浏览器中正确呈现CSS您是否尝试过刷新您的开发环境（网页包）？@Auriga不，我没有。您能给我一个如何进行刷新的源代码吗。@ShojibMahabub刷新环境意味着停止服务器并重新启动。您的组件有类

输入组输入组sm col-md-3

，但您的css选择器的目标是

.input group.input group sm.col-md-3

，这意味着它正在寻找嵌套类。通过删除空格，将css选择器更改为

.input group.input group sm.col-md-3

。这些似乎是引导风格，所以你很可能通过调整元素的边距和浮动来破坏引导功能。我有一个id为的div，我的应用程序应该安装在那里。你能看看这个吗？以下是问题链接：