作者:非策不劃小子白 | 来源:互联网 | 2024-10-26 18:42
本文分享了如何通过CSS提升原生表格的视觉效果,提供了多个实用的样式示例,帮助开发者打造美观、易读的表格布局。内容涵盖了边框、背景色、文字对齐等多方面的美化技巧,适合前端开发人员参考和应用。
// css展示界面table
.ui-table-body{
height: calc(100% - 38px);
overflow: auto
}
.ui-table-head{
width: calc(100% - 6px)
}
.ui-table{
width: 100%;
table-layout : fixed; //可以控制th,td的宽度,使百分比生效
}
th{
text-align: left;
position: -webkit-sticky;
position: sticky;
}
th,td{
height: 26px;
padding: 6px 4px;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}