如何忽略该表行内按钮中的“表”属性？

Posted 2023-03-05

【中文标题】如何忽略该表行内按钮中的“表”属性？

【英文标题】：How do I ignore "table" property in a button within a row of that table?

【发布时间】：2021-07-26 20:53:09

【问题描述】：

我正在使用引导程序并有一个带有属性“表”的表，以便为从数据库显示的数据制作浅色背景。它看起来不错，除非我为每一行添加一个按钮，这应该可以帮助我编辑该行中的数据。按钮本身变白并且几乎不可见，但如果我删除“表格”属性，数据显示不正确。

如何仅忽略按钮元素中的“表格”属性？在 .btn-css 中设置按钮的颜色没有帮助。

这是 html 代码：

<table class="table cons-table table-striped border">
        <thead>
           //Some code
        </thead>
        <tbody>
            //Some code
            //Button not displaying correctly
            <button class="btn btn-primary">Change</button>
        </tbody>
      </table>

CSS 代码来了。颜色变化没有效果：

.btn 
    background-color: solid;
    cursor:pointer;


.btn-primary 
  background-color: 24a0ed;

【问题讨论】：

这在无效的 HTML 中

我正在使用 Vue 框架。

仍然是无效的 HTML。 Vue 不会让你编写无效的 HTML AFAIK。

可以编译，怎么会失效？

将其放入 HTML 验证器中。浏览器永远不会为无效的 HTML 抛出错误，但它可能会产生意想不到的副作用

【参考方案1】：

您尝试过使用 !important 吗？

.btn-primary 
  background-color: 24a0ed !important;

【讨论】：

@Silvervarg 你能为此创建一个 jsfiddle 吗？

我不确定它是否有帮助，因为代码需要在外部数据库中显示，但如果您想在此处查看文件的整个代码结构，它是：@ 987654321@