HTML5使用Div标签回实现表格

HTML5使用Div标签来实现表格

当支持HTML5时，我们可以使用样式把DIV实现一个表格table. 关键样式语法：display: table，display: table-row，display: table-cell 下面例子说明。
样式代码：

 div {
            display: table;
        }

            div div {
                display: table-row;
            }

                div div div {
                    display: table-cell;
                    background: #EEE;
                    border: 1px solid #777;
                    padding: 1em;
                }

Source Code

控制器：

视图实现：

程序运行结果：

2楼Banianer: 如果第二行，第一个第二个单元格合并，第三个第四个单元格合并，如何实现？，，或者第1个为1个 2 3 4合并为一个单元格

1楼俊临天下: 然后怎么合并单元格呢

HTML5使用Div标签回实现表格

相关推荐