<table width="100" height="50" border="1" bgcolor="blue">
<caption>我是表头</caption>
<tr>
<th>哈哈1</th>
<th>哈哈2</th>
<th>哈哈3</th>
</tr>
<tr> <td bgcolor="red">4</td>
<td>5</td>
<td>6</td>
</tr>
<tr> <td colspan="3">2</td>
<!-- <td>2</td>
<td>3</td> -->
</tr>
</table>

2

-->

我是表头
哈哈1 哈哈2 哈哈3
4 5 6
2 3

table 中可以直接设置表格的宽 高 背景色 边框长度

caption标签为表头,不占用表格空间。

tr代表行,th/td代表单元格,单元格内可设置colspan=“x”实现跨多列,rowspan实现跨多行  也可以设置此单元格的背景色。

表格内文字对齐   通过设置align=“left、right、center” 实现。

以前接触前端的时候就是从table学起,当时感觉很有意思,短短几行代码就可以实现一个表格的功能,现在感觉table太low了,都懒得写。

当然table布局还是有一定缺点的:

  (1)table布局会占用更多的字节,影响加载速度。

  (2)table布局编写起来麻烦耗时,既不利于设计思维,影响开发者阅读体验。

  (3)不利于浏览器的顺序渲染。

HTML中的table布局的更多相关文章

  1. html中DIV+CSS与TABLE布局方式的区别及HTML5新加入的结构标签(转)

    DIV与TABLE布局的区别 div 和 table 的加载方式不同,div 的加载方式是即读即加载,遇到 <div> 没有遇到 </div> 的时候一样加载 div 中的内容 ...

  2. 日历控件table布局

    作为初学者,一开始就接触div+css ,所以说实话,我并不怎么喜欢table布局,一般逃避. 先上这次的效果图: 看到这个图,第一次用table布局没实现,原因是给tr加下边框失效.当时没找到原因, ...

  3. css table 布局

    使用CSS表格 CSS表格能够解决所有那些我们在使用绝对定位和浮动定位进行多列布局时所遇到的问题.例如,“display:table;”的CSS声明能够让一个HTML元素和它的子节点像table元素一 ...

  4. div+css与table布局

    1:速度和加载方式方面的区别 div 的加载方式是即读即加载,遇到 <div> 没有遇到 </div> 的时候一样加载 div 中的内容,读多少加载多少:table 的加载方式 ...

  5. 表格布局扩展/DW设计界面中快速整体布局页面的操作

    DW设计界面中快速整体布局页面的操作流程: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &q ...

  6. 关于table布局的推荐使用原因

    一.关于table布局的性能 1.table标签比其他html标签占用更多字节,导致下载时间延迟,占用服务器更多的流量资源: 2.table会阻碍浏览器渲染引擎的渲染顺序,导致页面生成的延迟,造成不良 ...

  7. html页面布局之table布局:

    table布局: table来做整体页面的布局,布局技巧归纳如下: (1)按照设计图的尺寸设置表格的宽高以及单元格的宽高 (2)将表格的border.cellpadding.cellspacing全部 ...

  8. table布局与div布局

      DIV与TABLE本身并不存在什么优缺点,所谓web标准只是推荐的是正确的使用标签,好比说:DIV用于布局,而TABLE则本来就是转二维数据的.让TABLE做该做的事,并不是说页面里不出现TABL ...

  9. PS切图导出代码后出现的图片布局散乱的解决方法——table布局

    前言: 一般来说,大部分美工PS切图后导出的都是使用PS默认的table布局的页面,出现最多的异常是上传代码,替换图片后,发现图片布局散乱,完全不是想要的效果.轻微的是浏览器不兼容,只有部分浏览器可以 ...

随机推荐

  1. 5种IE hasLayoutt的属性及其值

    hasLayout 是Windows  Internet  Explore 渲染引擎的一个内部组成部分.在 Internet Explore 中,一个元素要么自己对自身内容进行计算大小和组织,要么依赖 ...

  2. 使用python制作ArcGIS插件(5)其他技巧

    使用python制作ArcGIS插件(5)其他技巧 by 李远祥 使用python做插件开发,除了了解ArcToolBox工具之外,还需要在了解ArcPy的相关函数和接口.只有掌握了这些,才可以顺利的 ...

  3. asp.net core mvc权限控制:在视图中控制操作权限

    在asp.net core mvc中提供了权限验证框架,前面的文章中已经介绍了如何进行权限控制配置,权限配置好后,权限验证逻辑自动就会执行,但是在某些情况下,我们可能需要在代码里或者视图中通过手工方式 ...

  4. iOS8中 UITableView section 分区头部视图不显示

    最近自己使用了UITableView写了一个通讯录,但是在编写过程还算顺利,但是后来测试的时候,发现在iOS8中TableView的分区头不能正常显示,使用 - (NSString *)tableVi ...

  5. 图片上传裁剪zyupload

    图片上传控件用的是zyupload控件,使用过程中遇到了一些问题,特别记录下来 上图是目前的使用效果,这个控件我是用js代码动态添加出来的 HTML代码: <div class="wi ...

  6. matlab中hold指令、figure指令及subplot指令的使用

    一.hold指令使用 正常情况下,plot指令显示figure时,以前的数据丢失了.使用hold on指令后,此后添加的一系列plot曲线将叠加在前一个图上当使用hold off后,恢复为默认状况,p ...

  7. Java模拟新浪微博登陆抓取数据

    前言:  兄弟们来了来了,最近有人在问如何模拟新浪微博登陆抓取数据,我听后默默地抽了一口老烟,暗暗的对自己说,老汉是时候该你出场了,所以今天有时间就整理整理,浅谈一二. 首先:  要想登陆新浪微博需要 ...

  8. 可能是一份没什么用的爬虫代理IP指南

    写在前面 做爬虫的小伙伴一般都绕不过代理IP这个问题. PS:如果还没遇到被封IP的场景,要不就是你量太小人家懒得理你,要不就是人家压根不在乎... 爬虫用户自己是没有能力维护一系列的代理服务器和代理 ...

  9. [Kafka] - Kafka内核理解:消息的收集/消费机制

    一.Kafka数据收集机制 Kafka集群中由producer负责数据的产生,并发送到对应的Topic:Producer通过push的方式将数据发送到对应Topic的分区 Producer发送到Top ...

  10. 纯css实现京东导航菜单

    纯CSS代码实现导航菜单,推荐在chrome预览! 预览请点击这里:mygithub <!doctype html> <html lang="en"> &l ...