Vue3 table td设置 背景色, border不见了

table td设置 背景色, border不见了

img

于是 background 注掉

    <td class="table-cell" v-for="(i, index) in item" :key="index" :style="{
            // 'backgroundColor': i.attr.background_color, //这里不注掉 边框不出来
            'overflow': 'hidden',
            'border-left': i.attr.border?.left.width ? i.attr.border?.left.width + ' ' + i.attr.border?.left.style + ' ' + i.attr.border?.left.color : '',
            'border-right': i.attr.border?.right.width ? i.attr.border?.right.width + ' ' + i.attr.border?.right.style + ' ' + i.attr.border?.right.color : '',
            'border-top': i.attr.border?.top.width ? i.attr.border?.top.width + ' ' + i.attr.border?.top.style + ' ' + i.attr.border?.top.color : '',
            'border-bottom': i.attr.border?.bottom.width ? i.attr.border?.bottom.width + ' ' + i.attr.border?.bottom.style + ' ' + i.attr.border?.bottom.color : ''
          }">

背景不见了,边框也出来了

img

我新建一个 table 测试, 边框与背景可以同时存在. 这是啥梗

table-cell添加background-clip:padding-box;样式试试。

table得边框和背景是同时存在得,你看看你的边框颜色和背景色是不是一样,你弄一个颜色比较看出的,试试

style="{'backgroundColor': 'orange','overflow': 'hidden','border':'3px solid red'}"
您好,我是有问必答小助手,您的问题已经有小伙伴帮您解答,感谢您对有问必答的支持与关注!
PS:问答VIP年卡 【限时加赠:IT技术图书免费领】,了解详情>>> https://vip.csdn.net/askvip?utm_source=1146287632

你对比一下正式的和测试的生成的HTML和css有什么不同