1.确保您自己的样式表包含在HTML中Bootstrap * 之后 *。
1.通过在样式表中将.table的width设置为'auto'来覆盖Bootstrap的100% width样式声明：

.table {
  width: auto;
}

选项1

如果有可能在Bootstrap文件之后添加CSS文件，那么这就是所需要的全部：

.table {
    width: auto;
}

选项2

如果无法在Bootstrap文件之后添加CSS文件，可以按如下方式增加specificity：

table.table {
    width: auto;
}

注意，如果你把这段代码放在引导文件之后，也可以这样做。选项1只是稍微简单一些。

选项3（不推荐）

您还可以向规则添加!important声明，这意味着您的规则将覆盖Bootstrap样式，无论（1）它是在Bootstrap文件之前还是之后，以及（2）无论具体性如何：

.table {
    width: auto !important;
}

由于带有!important声明的CSS规则可以覆盖任何没有!important声明的规则，无论这些规则是在哪里定义的，也无论它们的特殊性如何，因此带有大量!important声明的样式很难维护和调试，因此建议避免使用!important，因此您应该使用选项1或选项2。这取决于CSS是在Bootstrap文件之前还是之后。

.table {
    width: initial;
}

或

.table {
    width: unset;
}

就可以了。

从Bootstrap 5（可能更早）开始，您可以使用Bootstrap实用程序类w-auto：

<table class="table w-auto">

.table{Width :100% !important;}