HTML教程-跨多行、多列的表元

2016-02-19 20:33 27 1 收藏

人生本是一个不断学习的过程，在这个过程中，图老师就是你们的好帮手，下面分享的HTML教程-跨多行、多列的表元懂设计的网友们快点来了解吧！

【 tulaoshi.com - Web开发】

　　要创建跨多行、多列的表元，只需在TH或TD中加入ROWSPAN或COLSPAN属性，这两个属性的值，表明了表元中要跨越的行或列的个数。

　　跨多列的表元 th colspan=#　td colspan=#

　　colspan表示跨越的列数，例如colspan=2表示这一格的宽度为两个列的宽度。

　　跨多行的表元 th rowspan=#　td rowspan=#　

　　rowspan所要表示的意义是指跨越的行数，例如rowspan=2就表示这一格跨越表格两个行的高度。

跨多列的表元

html
head
title表格TABLE/title
/head
/html

table border
trth colspan=3值班人员 /th
trth星期一/th th星期二/th th星期三/th
trtd李强/tdtd张明/tdtd王平/td
/table

跨多行的表元

html
head
title表格TABLE/title
/head
/html

table border
trth rowspan=2值班人员/th
th星期一/thth星期二/th th星期三/th/tr
trtd李强/tdtd张明/tdtd王平/td/tr
/table

来源:http://www.tulaoshi.com/n/20160219/1623976.html

上一篇： MySQL数据库技术（30)
下一篇：关于搜索引擎页面分析中的 javascript 处理的2个思路

看过《HTML教程-跨多行、多列的表元》的人还看了以下文章更多>>

CSS教程:使用ul进行网页的多列布局

标签： Web开发

几天在用CSS写三列布局的时候突然想到的这样一个方法，这个想法自己都觉得有些疯狂，如果其中有什么不对的地方请各位不吝指教。当需要写一个三列布局的时候，一般情况下我会选择使用如下的DIV布局方式：使用这样的嵌套方式无疑可以使代码出错的概率减少很多，但同时这样的布局也略显复杂，对于后期的维护也略显不便。我们在布局导航...

repeater实现多列显示

标签： Web开发

一、下面的代码实现，每行显示三列前台代码： table tr asp:repeater id="Repeater1" runat="server" ItemTemplate td%#DataBinder.Eval(Container.DataItem,"thing")%/td /ItemTemplate /asp:repeater /tr /table 后台代码： protected int i=1; private void ...

怎样在html文档里做隔行换色的多行方法

标签： Web开发

既然你都知道是隔行换色了，那就隔行换色就是了。方法很多。最直接的在每一行的tr上直接加bgcolor="red"。用css的话就定义行二个颜色的类。在每一行交替使用这个类就是了。如： tr class="trClass1" tr class="trClass2" New Document table{ width:100%; } .t1{ background:#ff6600; color...

CSS设计多列多模块等高网页布局

标签： Web开发

首先给大家看一个图：以前我们在布局这种需要多列多模块，多列等高，一般会选择横着切一张背景图来进行模拟，这个也是没有办法的办法。我们知道单纯的两列等高我们可以利用正内边距加负外边距来实现。padding-bottom:32767px; margin-bottom:-32767px; 这个方法的原理是事先通过正内边距来使其拥有足够高的布局...

CSS3教程(6):创建网站多列

标签： Web开发

使用CSS3可以为你的网站创建多列，而不用为每列制定特定的层或段落。上一篇文章：CSS3教程(5):网页背景图片与多背景图片一样，CSS3多列也是我最喜爱的一个技术。我想这条CSS3属性有在报纸和杂志布局中以外的很多潜在的用途。如果你在某个想法或个人网站中使用了这种方法，请在下面的评论中提交你的链接，我很高兴能确认这种方法能用于很...

查看更多精彩>>