<Th>在底部有一个细的白色边框，我只能用以下边框删除：0！important

问题描述

我相信这是

（实际上所有三个）在底部以及孩子身上都具有白色细边框，这是我唯一能够做到的方法删除它们是通过应用以下CSS：

    .headerI{
border: 0 !important
}

有问题的代码正在使用带有React-bootstrap {Table}的ReactJS。有什么想法吗？

                <Table id="tabularInputs">
                <thead id="tableHeader" className="col-lg-8 col-lg-offset-2">
                    <tr className="col-lg-12" text-left>
                        <th className="headerI">
                            <DropdownButton id="dropdownFormat" title={format[0].SD}>
                                <Dropdown.Item
                                    onClick={handleFormat}
                                    name="DD"
                                    href="#/action-1"
                                >
                                    {format[0].DD}
                                </Dropdown.Item>
                                <Dropdown.Item
                                    onClick={handleFormat}
                                    name="DDM"
                                    href="#/action-2"
                                >
                                    {format[0].DDM}
                                </Dropdown.Item>
                                <Dropdown.Item
                                    onClick={handleFormat}
                                    name="DMS"
                                    href="#/action-3"
                                >
                                    {format[0].DMS}
                                </Dropdown.Item>
                            </DropdownButton>
                        </th>
                        <th className="headerII">Latitude</th>
                        <th className="headerIII">Longitude</th>
                    </tr>
                </thead>
                <TableBody />
            </Table>

1 个答案:

答案 0 :(得分：0)

我查看了边框的来源，并将其应用于th元素有两种方式（可能更多，但我看到了两种）：

.table thead th {
    border-bottom: 2px solid #dee2e6;
}

.table td,.table th {
    border-top: 1px solid #dee2e6;
}

核心问题是您的样式需要比这些样式更具针对性才能应用，因为CSS优先考虑最具体的类型。

这没有影响：

.headerI {
    border-bottom: 0;
}

但是确实如此！

.table th.headerI {
    border-bottom: 0;
}

但是让我们给它起一个更好的名字，并且也去掉顶部边框。

.table th.borderless {
    border: 0;
}

相关问题

• 删除最后一个边框底部？
• PageViewer顶部和底部有白色边框
• ImageView删除白色边框？
• 如何删除Bootstrap 3类行底部白色边框
• 删除ShareActionProvider白色边框
• Tkinter：删除Canvas外部的白色边框
• 删除Tableview Swift中Header View Section的白色边框底部
• JPanel底部的怪异白色边框
• 微调框下拉边框底部删除
• <Th>在底部有一个细的白色边框，我只能用以下边框删除：0！important

最新问题

• 我写了这段代码，但我无法理解我的错误
• 在此代码中是否有使用“this”的替代方法？
• 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
• 为什么我的 Onclick 箭头功能在 React 中不起作用？
• java中的random.expovariate()
• 每千个数字得到
• 是否有可能使 loadstring 不可能等于打印？卢阿
• 启动调试会话时出错 - Google Cloud Shell
• 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
• Appscript 通过会议在 Google 日历中发送电子邮件和创建活动

解决方法

我查看了边框的来源，并将其应用于th元素有两种方式（可能更多，但我看到了两种）：

.table thead th {
    border-bottom: 2px solid #dee2e6;
}

.table td,.table th {
    border-top: 1px solid #dee2e6;
}

核心问题是您的样式需要比这些样式更具针对性才能应用，因为CSS优先考虑最具体的类型。

这没有影响：

.headerI {
    border-bottom: 0;
}

但是确实如此！

.table th.headerI {
    border-bottom: 0;
}

但是让我们给它起一个更好的名字，并且也去掉顶部边框。

.table th.borderless {
    border: 0;
}