Question

反应代码：

<div style={{paddingLeft: '8px', paddingRight: '8px'}}>
                            <div className="-subtitle">
                                <div className="pull-right" style={{marginBottom:'5px'}}>
                                    <Button bsStyle="primary" bsSize="xsmall" onClick={this.actionAdd}>Create New Parameter</Button>
                                </div>
                                <BootstrapTable
                                    data={item.params}
                                    className="removeTop"
                                    striped
                                    hover>
                                    <TableHeaderColumn
                                        className="tableHeader"
                                        width="100px"

                                    >Name</TableHeaderColumn>
                                    <TableHeaderColumn
                                        className="tableHeader"
                                        dataSort
                                        width="200px"
                                    >GUI Name</TableHeaderColumn>
                                    <TableHeaderColumn
                                        className="tableHeader"
                                        dataSort
                                        width="100px"
                                    >Default</TableHeaderColumn>
                                    <TableHeaderColumn
                                        className="tableHeader"
                                        dataSort
                                        width="300px"
                                    >Options</TableHeaderColumn>
                                    <TableHeaderColumn
                                        className="tableHeader"
                                        dataField="required"
                                        dataSort
                                        width="100px"
                                    >Required</TableHeaderColumn>
                                    <TableHeaderColumn
                                        className="tableHeader"
                                        dataField="multiline"
                                        isKey
                                        dataSort
                                        width="100px"
                                    >Multiline</TableHeaderColumn>
                                    <TableHeaderColumn
                                        className="tableHeader"
                                        dataField=""
                                        dataSort
                                        width="100px"
                                    >Delete</TableHeaderColumn>
                                </BootstrapTable>

我不确定这是否是BootstrapTable错误，但是当有pull-right元素时，该表会在具有pull-right的元素周围创建边框，这是正确的在<BootstrapTable>之前。上面的代码给出了这样的：如果没有pull-right，则Button周围没有顶部边框，这正是我希望的那样（但Button应该是.react-bs-table-container在右边）。

当我使用工具进行检查时，会显示Button在BootstrapTable和.react-bs-table { border-top: none !important; }周围创建边框。

但是当我添加这个元素时：

<Button>

它只删除顶部边框，但不删除边：

有没有办法删除.style { background: green; } :global(.no-touchevents) .style { background: red; }周围的边框？

Answer 1

要移除侧边框，请添加

   .react-bs-table {
            border-top: none !important;
            border-left: none !important;
            border-right: none !important;

        }

要删除按钮上的边框，您可能需要这样的内容：

button { padding: 0; border: none; background: none;}

Answer 2

试试这个 border：none;
边界：0;
border-color：transparent;
轮廓：0;
边界崩溃：崩溃; （主要的div）

删除Bootstrap表的顶部边框和边

2 个答案: