当支持HTML5时,我们可以使用样式把DIV实现一个表格table. 关键样式语法:display: tabledisplay: table-rowdisplay: 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

控制器:

视图实现:

程序运行结果:

HTML5使用Div标签来实现表格的更多相关文章

  1. IT兄弟连 HTML5教程 HTML5文字版面和编辑标签 使用HTML表格

    表格在网站中应用得非常广泛,使用它可以方便.灵活地排版,很多动态大型网站也都是借助表格排版的,但现在都使用DIV+CSS进行页面布局.表格可以把相互关联的信息元素集中定位,使浏览页面的人一目了然.在H ...

  2. 从a标签为什么不能包含div标签-了解HTML5元素分类与内容模型

    我们知道按新的 HTML 规范,已经不按 inline 和 block 来区分元素类型了.所以我们在a标签里面使用div标签时候会发现a标签并不能通过改变css盒子模型的方式将div元素包含. 元素分 ...

  3. 来吧,HTML5之基础标签(上)

    什么是html5 HTML 5 是下一代的 HTML.HTML5 仍处于完善之中.然而,大部分现代浏览器已经具备了某些 HTML5 支持. 学习过程中标签的理解 <a>标签  定义超链接, ...

  4. HTML5新增结构标签

    引言 在本节中,笔者将向大家讲述三部分内容,分别介绍HTML5时代的召唤,跟HTML4的区别,以及HTML5中带来的新的结构标签. HTML5时代的召唤 HTML4与HTML5的区别 HTML5新结构 ...

  5. 测试开发之前端——No2.HTML5中的标签

    HTML5中的标签. 标签 描述 <!--...--> 定义注释. <!DOCTYPE>  定义文档类型. <a> 定义超链接. <abbr> 定义缩写 ...

  6. 来吧,HTML5之基础标签(下)

    <dialog> 标签 定义对话框或窗口. <dialog> 标签是 HTML 5 的新标签.目前只有 Chrome 和 Safari 6 支持 <dialog>  ...

  7. html5语义化标签使用规范

    Html5添加了很多语义化标签,一个典型的html5页面结构可以如下安排 一.使用案例 1. 头部——header和nav标签 header头部,body下的直接子元素header一般用于放页面的介绍 ...

  8. HTML5部分新标签属性及DOM扩展元素

    HTML5定义了一系列新元素,如新语义标签.智能表单.多媒体标签等. 我们日常讨论的H5其实是一个泛称,它指的是由HTML5 + CSS3 + Javascript等技术组合而成的一个应用开发平台. ...

  9. html5应用程序标签

    一.html5应用程序标签 (1)datalist需要数据载体 input list属性指向数据源 <input type="text" list="input_l ...

随机推荐

  1. [.net 面向对象编程基础] (10) 类的成员(字段、属性、方法)

    [.net 面向对象编程基础] (10) 类的成员(字段.属性.方法) 前面定义的Person的类,里面的成员包括:字段.属性.方法.事件等,此外,前面说的嵌套类也是类的成员. a.类的成员为分:静态 ...

  2. 跨站请求伪造CSRF

    CSRF是Cross Site Request Forgery的缩写,乍一看和XSS差不多的样子,但是其原理正好相反,XSS是利用合法用户获取其信息,而CSRF是伪造成合法用户发起请求. 在XSS危害 ...

  3. xamarin UWP设置HUD加载功能

    使用xamarin开发的时候经常用到加载HUD功能,就是我们常见的一个加载中的动作,Android 下使用 AndHUD , iOS 下使用 BTProgressHUD, 这两个在在 NuGet 上都 ...

  4. swift 加载 storyboard 里的UIViewController

    let storyBoard:UIStoryboard! = UIStoryboard(name: "Main", bundle: nil) let deskVC:DeskView ...

  5. 简单总结java 语法

    通过学习慢慢的爱上了这门语言,在Java的学习过程中,可能会遇到形形色色的问题不容易解决,应多去专业论坛了解相关的知识,书本上的知识有限.要会从网上搜索有用的信息加以整理,促进学习的深入和知识水平的提 ...

  6. 修复发生“由于数据移动,未能继续以 NOLOCK 方式扫描”错误的数据库

    最近在系统运行中发现了一个错误,错误信息如下: 错误信息:查询A201412C20568单证信息错误 ---> System.Data.OleDb.OleDbException: 由于数据移动, ...

  7. 用例设计工具PICT — 输入组合覆盖

    1 成对测试简介 成对测试(Pairwise Testing)又称结对测试.两两测试,是一种正交分析的测试技术.成对组合覆盖这一概念是Mandl于1985年在测试Aad编译程序时提出来的.是当不可能遍 ...

  8. echart饼状图使用,打发时间。

    新公司,刚来几天,闲着没事,领导让我做些无关痛痒的活,优化报表统计!!!之前是用flash做的,现在要改成echart实现.好吧,之前没用过,抱着学习态度,研究了下.写点东西打发下时间,能帮到需要帮助 ...

  9. 【WP开发】使用磁倾仪

    磁倾仪,也叫倾斜仪,主要用来检测手机设备在各个轴上旋转的角度.注意,磁倾仪与陀螺仪的差异,陀螺仪的关注点是旋转的角速度,它并不关注角度,只注重速度.而磁倾仪的读数就是设备倾斜的角度. 不管是使用重力感 ...

  10. java中TreeSet集合如何实现元素的判重

    /* 看一下部分的TreeSet源码.... public class TreeSet<E> extends AbstractSet<E> implements Navigab ...