Question

我的表格未使用bootstrap.css中的样式

我的容器中的导入内容如下：

import React, { Component } from "react";
import "../styles/Projects.css";
import axios from "axios";
import { Button } from "react-bootstrap";
import 'react-bootstrap-table-next/dist/react-bootstrap-table2.min.css';
import 'react-bootstrap-table2-paginator/dist/react-bootstrap-table2-paginator.min.css';
import BootstrapTable from 'react-bootstrap-table-next';
import paginationFactory from 'react-bootstrap-table2-paginator';

export default class Projects extends Component {
    constructor(props) {
        super(props);

下面呈现表的代码如下：

        return (
        <div style={projectStyle}>
            <BootstrapTable
                selectRow={selectRow}
                keyField='id'
                data={this.state.projectList}
                columns={columns}
                pagination={paginationFactory(paginationOptions)}
            />
        </div>
    )

我不知道是否应该在其他地方（例如App.js中）添加导入，因为这是我第一次使用react。

看起来像这样https://i.imgur.com/rwX1nRd.png，我希望应用样式，因此实际上至少看起来像样的一半。

Answer 1

尝试将Bootstrap添加到HTML <head> <link rel="stylesheet" type="text/css" href="http://yourwebsite.come/yourbootstrap/bootstrapfile.css"> </head>的头部在href中将您自己的URL添加到CSS文件中！希望这会有所帮助！

默认样式不适用于react-bootstrap组件

1 个答案: