Javascript 使用CSS设置数据表样式以删除边框并更改数据单元格高度？

我有一个vuetify数据表，我正在尝试自定义样式以删除边框并将高度更改为40 px，但它似乎不起作用。这是一个样本

新Vue{ el:“应用程序”， 资料{ 返回{ 标题：[{ 文字：“甜点100克服务”， 对齐：“左”， 可排序：false， 值：“名称” }, { 文字：“卡路里”， 价值：“卡路里” }, { 文本：“Fat g”， 价值：“脂肪” }, { 文本：“碳水化合物g”， 价值：“碳水化合物” }, { 文本：“蛋白质g”， 价值：“蛋白质” }, { 文字：“铁%”， 价值：“铁” } ], 甜点：[{ 名称：“冷冻酸奶”， 卡路里：159， 脂肪：6.0， 碳水化合物：24， 蛋白质：4.0， 铁：“1%” }, { 名称：“冰淇淋三明治”， 卡路里：237， fat:9.0， 碳水化合物：37， 蛋白质：4.3， 铁：“1%” }, { 名称：“Eclair”， 卡路里：262， 脂肪：16.0， 碳水化合物：23， 蛋白质：6.0， 铁：“7%” }, { 名字：“纸杯蛋糕”， 卡路里：305， 脂肪：3.7， 碳水化合物：67， 蛋白质：4.3， 铁：“8%” }, ] } } } .table.v-table.tbody.td， 表5.v-表4.T车身.th{ 高度：40px！重要； 边界：隐藏！重要； } {{props.item.name} {{props.item.carries} {{props.item.fat} {{props.item.carbs} {{props.item.protein} {{props.item.iron}

---

我想这些应该适合你我在Chrome中的表上单击鼠标右键，然后单击“检查”以查找您试图覆盖的样式

table.v-table tbody td {
    height: 40px;
    border: none;
}
.theme--light.v-table tbody tr:not(:last-child) {
    border-bottom: none;
}

---

您的css有错误的选择器路径，必须是：

表{边框折叠：折叠}//删除边框 表td，表th{ 高度：40px；//更改高度 }