带边框的表格
| # | Task | Progress | Label |
|---|---|---|---|
| 1. | Update software |
|
55% |
| 2. | Clean database |
|
70% |
| 3. | Cron job running |
|
30% |
| 4. | Fix and squish bugs |
|
90% |
紧凑型的表格
| # | Task | Progress | Label |
|---|---|---|---|
| 1. | Update software |
|
55% |
| 2. | Clean database |
|
70% |
| 3. | Cron job running |
|
30% |
| 4. | Fix and squish bugs |
|
90% |
响应式表格
| ID | User | Date | Status | Reason |
|---|---|---|---|---|
| 183 | John Doe | 11-7-2014 | Approved | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. |
| 219 | Alexander Pierce | 11-7-2014 | Pending | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. |
| 657 | Bob Doe | 11-7-2014 | Approved | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. |
| 175 | Mike Doe | 11-7-2014 | Denied | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. |
响应式表格加强版
| ID | User | Date | Status | Reason | Operator |
|---|---|---|---|---|---|
| 183 | John Doe | 11-7-2014 | Approved | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. | 增加 删除 详情 其他 待定 |
| 219 | Alexander Pierce | 11-7-2014 | Pending | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. | 增加 删除 详情 其他 待定 |
| 657 | Bob Doe | 11-7-2014 | Approved | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. | 增加 删除 详情 其他 待定 |
响应式表格加强版2
| ID | User | Date | Status | Reason | Operator |
|---|---|---|---|---|---|
| 183 | John Doe | 11-7-2014 | Approved | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. | |
| 219 | Alexander Pierce | 11-7-2014 | Pending | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. | |
| 657 | Bob Doe | 11-7-2014 | Approved | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. |
纯css3美化checkbox兼容到ie8,IE8中父包含块必须增加类.ie8,
使用`CSS HACK` ,还有针对移动端重置了一些样式
操作那里的按钮提供了三种样式,图标/颜色/扁平化,标签的那种只有颜色
| User | Date | Status | Reason | Operator | |
|---|---|---|---|---|---|
| John Doe | 11-7-2014 | Approved | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. |
|
|
| John Doe | 11-7-2014 | Approved | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. |
|
|
| John Doe | 11-7-2014 | Approved | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. |
|
给表格行添加颜色,bootstrap内置样式;
通过给行tr添加对应的类显示效果,
.active,.success ,
.warning , .danger ,
.info
| User | Date | Status | Reason | Operator | |
|---|---|---|---|---|---|
| John Doe | 11-7-2014 | Approved | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. |
|
|
| John Doe | 11-7-2014 | Approved | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. |
|
|
| John Doe | 11-7-2014 | Approved | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. |
|
|
| John Doe | 11-7-2014 | Approved | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. |
|
|
| John Doe | 11-7-2014 | Approved | Bacon ipsum dolor sit amet salami venison chicken flank fatback doner. |
|