Question

我正在使用Bootstrap 3.x和这样的表定义

<table class="table table-hover table-condensed table-striped table-bordered">

非常标准的东西

我想减少单元格上的默认垂直填充 - 希望进一步减少单元格上的填充。我知道table-condensed将垂直填充减少了50％。我想将它减少到1px。

我在哪里进行更改？我试过通过bootstrap.min.css但是找不到任何可以修改的内容 - 我不理解

非常感谢提前

祝福

艾尔

Answer 1

如果您知道如何使用浏览器的检查工具（右击 - ＆gt;检查元素），这很容易。如果你想学习CSS，这将是一个非常重要的工具。

所以找到这个属性：

.table-condensed>thead>tr>th, .table-condensed>tbody>tr>th, .table-condensed>tfoot>tr>th, .table-condensed>thead>tr>td, .table-condensed>tbody>tr>td, .table-condensed>tfoot>tr>td{
    padding: 5px;
}

有padding: 5px;，将其更改为1px。

以下是更改时 looks 的方式。

Answer 2

+1＆＃34;检查元素＆＃34; ...告诉您每个元素的确切设置以及它们的来源。用于处理布局的宝贵工具。

至于自定义Bootstrap（至少v3），我相信Site.css是本地站点级覆盖文件...所以不要更改核心引导程序css文件...而只是在Site.css中添加覆盖样式并将其作为您的个人档案。如果样式覆盖似乎没有，请将！important标记添加到它们中。如果您更新了引导包，请务必保存Site.css的副本，以便重新应用自定义。

Answer 3

注意-与其修改.table-condensed类，该类将使所有使用此引导程序类的表取代，反而使另一个类（例如table_morecondensed）更有利……

.table_morecondensed>thead>tr>th, 
.table_morecondensed>tbody>tr>th, 
.table_morecondensed>tfoot>tr>th, 
.table_morecondensed>thead>tr>td, 
.table_morecondensed>tbody>tr>td, 
.table_morecondensed>tfoot>tr>td{ padding: 2px; }

bootstrap减少行填充

3 个答案: