当支持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. 赴美工作常识(Part 6 - 绿卡排队)

    上一篇<赴美工作常识(Part 5 - 绿卡优先级)>解释完排队的优先级是怎么确定的,以及 PERM 和 I–140 表的意义,接下来就要解释一下队具体是怎么排的以及排到之后的 I–485 ...

  2. Unity3D使用经验总结 缺点篇

    不论是从官方手册,还是各种第三方教程,几乎涉及到的,都是讲如何使用U3D,以及U3D的优点. 虽然我是用的一个让步语气,但请不要否认U3D的这些优点,它们的确存在. 但对于一个引擎的特性来说,优点与缺 ...

  3. ECMAScript5 Array新增方法

    数组在各个编程语言中的重要性不言而喻,但是在之前的JavaScript中数组(JavaScript 数组详解)虽然功能已经很强大,但操作方法并不完善,在ECMAScript5中做了适当的补充. Arr ...

  4. 使用Async和Await进行异步编程(C#版 适用于VS2015)

    你可以使用异步编程来避免你的应用程序的性能瓶颈并且加强总体的响应.然而,用传统的技术来写异步应用是复杂的,同时编写,调试和维护都很困难. VS2012介绍了简单的方法,那就是异步编程,它在.Net F ...

  5. splice slice

    array的方法中,有这么两个方法, 很久之前接触flex的时候就知道了. 可是总是记不太清. splice() 方法向/从数组中添加/删除项目,然后返回被删除的项目 slice() 方法可从已有的数 ...

  6. lua如何调用C++函数

    第一步是定义函数.所有在Lua中被调用的C/C++函数将使用下面一类指针进行调用: typedef int (*lua_CFunction) (lua_State *L); 换句话说,函数必须要以Lu ...

  7. Atitit usrqbg1821 Tls 线程本地存储(ThreadLocal Storage 规范标准化草案解决方案ThreadStatic

    Atitit usrqbg1821 Tls 线程本地存储(ThreadLocal Storage 规范标准化草案解决方案ThreadStatic 1.1. ThreadLocal 设计模式1 1.2. ...

  8. jQuery贪吃蛇--jQuery学习

    我用JQuery有一段时间了,越来越体会到其强大之处,于是自己尝试写了一个贪吃蛇小游戏,拿来与网友分享一下. 1. 了解JQuery.Timers 除用到了jQuery1.5.1之外,我还用到了jQu ...

  9. 新浪微博SDK开发(2):上传图片的技术难点

    在微博模块中,有一个API是可以发表带一张图片的微博的,当然提交方式是POST.在封装的时候,可能会遇到一个难点——如何上传图片? 要POST微博的同时带有图片,POST的内容必须为MultiPart ...

  10. js阻止冒泡及jquery阻止事件冒泡示例介绍

    js阻止冒泡 在阻止冒泡的过程中,W3C和IE采用的不同的方法,那么我们必须做以下兼容. 复制代码 代码如下: function stopPro(evt){ var e = evt || window ...