Javascript 为什么react引导未将样式添加到我的网格布局

Javascript 为什么react引导未将样式添加到我的网格布局,javascript,reactjs,bootstrap-4,react-bootstrap,Javascript,Reactjs,Bootstrap 4,React Bootstrap,我正在制作Promotoro时钟。我使用react bootstrap编写代码。它正在工作,但bootstrap的默认类的样式没有添加到样式中。它只是相互叠加 import React,{Component}来自“React”; 导入“/App.css”; 从“react bootstrap/lib/Grid”导入网格; 从“react bootstrap/lib/Row”导入行; 从“react bootstrap/lib/Col”导入Col; 类应用程序扩展组件{ render(){ 返回

我正在制作Promotoro时钟。我使用react bootstrap编写代码。它正在工作,但bootstrap的默认类的样式没有添加到样式中。它只是相互叠加

import React,{Component}来自“React”;
导入“/App.css”;
从“react bootstrap/lib/Grid”导入网格;
从“react bootstrap/lib/Row”导入行;
从“react bootstrap/lib/Col”导入Col;
类应用程序扩展组件{
render(){
返回(
普罗多罗钟
会议时间
25
休息时间
5.
);
}
}
.App{
文本对齐:居中;
}
html{
身高:100%;
}
身体{
身高:100%;
}
.主货柜{
最大宽度:800px;
保证金:0自动;

}
因为您没有导入css文件:

import 'bootstrap/dist/css/bootstrap.min.css'

在npm安装引导程序之前安装引导程序--保存,因为您没有导入css文件:

import 'bootstrap/dist/css/bootstrap.min.css'

在npm安装引导程序之前安装引导程序--保存

如果要同时导入多个内容,可能需要使用以下方法:

从'react bootstrap'导入{Grid,Row,Col}

此外,请确保将样式表导入页面上的某个位置,如文档中所述:


如果要同时导入多个内容,可能需要使用以下方法:

从'react bootstrap'导入{Grid,Row,Col}

此外,请确保将样式表导入页面上的某个位置,如文档中所述:


它不会自动添加css。它只提供HTML标记。要包含css,如果您没有安装Bootstrap,只需安装Bootstrap即可
npm安装Bootstrap--save
并像导入'Bootstrap/dist/css/Bootstrap.min.css'一样使用它
It settms告诉我你正在使用bootstrap3,所以你必须从CDN中提取它
https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css
我强烈建议使用
reactstrap
而不是使用
React Bootstrap
。reactstrap提供bootstrap4支持,但React Bootstrap是Bootstrap 3I刚删除了网格标记后的h1标记,并且似乎网格标记中的所有元素都必须是rowsIt,而不是自动添加css。它只提供HTML标记。要包含css,如果您没有安装Bootstrap,只需安装Bootstrap即可
npm安装Bootstrap--save
并像导入'Bootstrap/dist/css/Bootstrap.min.css'一样使用它
It settms告诉我你正在使用bootstrap3,所以你必须从CDN中提取它
https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css
我强烈建议使用
reactstrap
而不是使用
React Bootstrap
。React Bootstrap提供bootstrap4支持,但React Bootstrap是Bootstrap 3I刚删除了网格标记后的h1标记,它工作起来好像网格标记内的所有元素都必须是行谢谢我已经包括了问题实际上是h1,网格似乎应该只嵌套行标记谢谢我已经包括了问题实际上是在网格之后出现的,看起来网格应该只嵌套行标记