@table-prefix-cls: ~"@{css-prefix}table"; .@{table-prefix-cls} { width: 100%; max-width: 100%; overflow: hidden; color: @text-color; font-size: @font-size-small; background-color: #fff; border: 1px solid @border-color-base; border-bottom: 0; border-collapse: collapse; box-sizing: border-box; position: relative; &-with-header{ border-radius: @border-radius-base @border-radius-base 0 0; } &-with-footer{ border: 1px solid @border-color-base; border-radius: 0 0 @border-radius-base @border-radius-base; } &-with-header&-with-footer{ border-radius: @border-radius-base; } &-title, &-footer{ height: 48px; line-height: 48px; border-bottom: 1px solid @border-color-split; } &-footer{ border-bottom: none; } &-body{ overflow-x: hidden; overflow-y: auto; position: relative; } &-with-fixed-top{ border-bottom: 1px solid @border-color-base; } &-with-fixed-top&-with-footer{ .@{table-prefix-cls}-footer{ border-top: 1px solid @border-color-base; } tbody tr:last-child td{ border-bottom: none; } } th, td { min-width: 0; height: 48px; box-sizing: border-box; text-align: left; text-overflow: ellipsis; vertical-align: middle; position: relative; border-bottom: 1px solid @border-color-split; } th { height: 40px; white-space: nowrap; overflow: hidden; background-color: @table-thead-bg; } td{ background-color: #fff; transition: background-color @transition-time @ease-in-out; } th&-column, td&-column { &-left{ text-align: left; } &-center{ text-align: center; } &-right{ text-align: right; } } & table{ width: 100%; } &-border{ th,td{ border-right: 1px solid @border-color-split; } } &-cell{ padding-left: 18px; padding-right: 18px; overflow: hidden; text-overflow: ellipsis; white-space: normal; word-break: break-all; box-sizing: border-box; } th &-cell{ display: inline-block; position: relative; word-wrap: normal; vertical-align: middle; } &-stripe &-body{ tr:nth-child(2n) { td{ background-color: @table-td-stripe-bg; } } } tr&-row-hover{ td{ background-color: @table-td-hover-bg; } } &-large { font-size: @font-size-base; th{ height: 48px; } td{ height: 60px; } &-title, &-footer{ height: 60px; line-height: 60px; } } &-small{ th{ height: 32px; } td{ height: 40px; } &-title, &-footer{ height: 40px; line-height: 40px; } } &-row-highlight, tr&-row-highlight&-row-hover, &-stripe &-body tr&-row-highlight:nth-child(2n) { td{ background-color: @table-td-highlight-bg; } } }