table-title style (#2452)

pull/2460/head
ddcat1115 9 years ago committed by 偏右
parent 44b8f38a3c
commit eba54529ca

@ -1,9 +1,9 @@
---
order: 10
title: 边框和页脚
title: 边框,页头和页脚
---
添加表格边框线和页脚。
添加表格边框线,页头和页脚。
````jsx
import { Table } from 'antd';
@ -40,8 +40,13 @@ const data = [{
address: '西湖区湖底公园1号',
}];
ReactDOM.render(<Table columns={columns} dataSource={data} bordered footer={() => '页脚'} />
, mountNode);
ReactDOM.render(<Table
columns={columns}
dataSource={data}
bordered
title={() => '页头'}
footer={() => '页脚'}
/>, mountNode);
````
````css

@ -72,6 +72,7 @@ const columns = [{
| bordered | 是否展示外边框和列边框 | Boolean | false |
| showHeader | 是否显示表头 | Boolean | true |
| footer | 表格底部自定义渲染函数 | Function(currentPageData) | |
| title | 表格头部自定义渲染函数 | Function(currentPageData) | |
| scroll | 横向或纵向支持滚动,也可用于指定滚动区域的宽高度:`{{ x: true, y: 300 }}` | Object | - |
### Column

@ -75,6 +75,26 @@
border: 1px solid @border-color-split;
}
&-title {
padding: 16px 8px;
position: relative;
top: 1px;
border-radius: @border-radius-base @border-radius-base 0 0;
}
&.@{table-prefix-cls}-bordered &-title {
border: 1px solid @border-color-split;
}
&-title + &-content {
position: relative;
table {
border-top-left-radius: 0;
border-top-right-radius: 0;
}
}
tr.@{table-prefix-cls}-row-selected {
background: #fafafa;
}

@ -60,7 +60,7 @@
"rc-slider": "~3.7.3",
"rc-steps": "~2.1.5",
"rc-switch": "~1.4.2",
"rc-table": "~4.3.5",
"rc-table": "~4.4.0",
"rc-tabs": "~5.9.2",
"rc-time-picker": "~1.1.5",
"rc-tooltip": "~3.4.1",

Loading…
Cancel
Save