滑动表格
外层嵌套一个盒子设置固定大小,并添加overflow:hidden auto只有y轴滑动,隐藏x轴滑动
表头固定不滑动可以添加position:sticky;top:0
<div style="width:878px;height:685px;overflow:hidden auto" class="tableDiv">
<n-table class="Tab-1-table">
<thead style="position:sticky;top:0">
</thead>
<tbody>
</tbody>
</n-table>
</div>
</div>
</div>
不想显示滑动条可以添加:文章来源:https://www.toymoban.com/news/detail-716026.html
.tableDiv::-webkit-scrollbar {
display: none; /* Chrome Safari */
}
使表格不超出固定宽度,文字自适应换行
.Tab-1-table {
table-layout: fixed;
word-break: break-word;
word-wrap: break-word;
}
表格组件:https://www.naiveui.com/zh-CN/os-theme/components/table文章来源地址https://www.toymoban.com/news/detail-716026.html
到了这里,关于css-表格样式的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!