colspanrowspan这两个属性用于创建特殊的表格。

colspan用来指定单元格横向跨越的列数:colspan就是合并列的,colspan=2的话就是合并两列。

rowspan用来指定单元格纵向跨越的行数:rowspan就是用来合并行的,比如rowspan=2就是合并两行,

  • rowspan通常使用在tdth标签中
  • row:行,span:跨度,跨距,范围
  • col:列,span:跨度,跨距,范围

<body>
<table border="1" width="300">
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
</table>
</br>
<table border="1" width="300">
<tr>
<td colspan=3>合并第一行的三列</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
</table>
</br>
<table border="1" width="300">
<tr>
<td rowspan="2">合并第一列的两行</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>5</td>
<td>6</td>
</tr>
</table>
</body>

在浏览器中将显示如下

html表单元素的colspan和rowspan的更多相关文章

  1. 详解HTML中的表单元素

    代码详讲: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" c ...

  2. jquery获取表单元素与回显

    一.获取哦表单元素 dcoument表单文本对象的集合 all[] 对所有html元素的访问 forms 返回对文档中所有form对象的引用 forms[1] 对所有form对象引用 <scri ...

  3. HTML5 学习总结(二)——HTML5新增属性与表单元素

    一.HTML5新增属性 1.1.contextmenu contextmenu的作用是指定右键菜单. <!DOCTYPE html> <html> <head> & ...

  4. CSS之表单元素

    表单就是收集用户信息的,就是让用户填写的.选择的. 1                <div> 2                         <h3>欢迎注册本网站&l ...

  5. 表单元素的submit()方法和onsubmit事件

    1.表单元素中出现了name="submit"的元素 2.elemForm.submit();不会触发表单的onsubmit事件 3.动态创建表单时遇到的问题 表单元素拥有subm ...

  6. HTML5 学习笔记(二)——HTML5新增属性与表单元素

    目录 一.HTML5新增属性 1.1.contextmenu 1.2.contentEditable 1.3.hidden 1.4.draggable 1.5.data-* 1.6.placehold ...

  7. 【原】如何改变表单元素的外观(for Webkit and IE10)

    表单元素在网页设计中使用的非常频繁,如文本输入框.单选框.复选框.选择列表.上传文件,它们在浏览器中的展现有自带的外观,为了在视觉上取得更好的产品体验,保持客户端的统一,通常产品经理会提出需要改变它的 ...

  8. MVC中使用内建的HTML辅助方法产生表单元素提交表单与button按钮事件的陷阱

    网站模板页有个登陆的退出按钮,当点击时跳转到登陆页面. <button onclick="logout()" >退出</button> $("#l ...

  9. [转]CSS 表单元素对齐详解

    来源:http://blog.sina.com.cn/s/blog_655388ed0100lzyk.html 简单的设置input{vertical-align:middle}即可,完美的: lab ...

随机推荐

  1. CSS语法小记

    一.CSS语法结构 语法:选择符{属性:值} 例如:body{font-size:12px;} 参数说明: 1.选择符(Selector):指明这组样式所要针对的对象.可以是一个XHTML标签,例如h ...

  2. September 19th 2016 Week 39th Monday

    We come nearest to the great when we are great in humility. 我们最为谦逊的时候越接近伟大. When you are powerful en ...

  3. printf 打印 unit32_t

    今天在网上找了老半天终于找到了:printf 打印 uint32_t 类型  uint32_t domainId; printf("\ndomainId=========%lu", ...

  4. 384. Shuffle an Array

    Shuffle a set of numbers without duplicates. Example: // Init an array with set 1, 2, and 3. int[] n ...

  5. html+css学习笔记:实用LessColor函数搭建配色方案

    http://www.zcool.com.cn/article/ZMTUyNDc2.html 前言:用LESS CSS框架进行编码会简化代码结构,提高我们的工作效率,但是试验后你会发现,默认情况下,L ...

  6. 数据结构和算法 – 7.散列和 Hashtable 类

    7.1.散列函数 散列是一种常见的存储数据的技术,按照这种方式可以非常迅速地插入和取回数据.散列所采用的数据结构被称为是散列表.尽管散列表提供了快速地插入.删除.以及取回数据的操作,但是诸如查找最大值 ...

  7. catch that cow (bfs 搜索的实际应用,和图的邻接表的bfs遍历基本上一样)

    Catch That Cow Time Limit: 2000MS   Memory Limit: 65536K Total Submissions: 38263   Accepted: 11891 ...

  8. 智能车学习(十七)——舵机学习

    一.舵机的结构      舵机简单的说就是集成了直流电机.电机控制器和减速器等,并封装在一个便于安装的外壳里的伺服单元.能够利用简单的输入信号比较精确的转动给定角度的电机系统.舵机安装了一个电位器(或 ...

  9. 动态平衡二叉搜索树的简易实现,Treap 树

    http://blog.csdn.net/qichi_bj/article/details/8232048

  10. CF735C 数论\平衡树叶子节点的最大深度\贪心\斐波那契\条件归一化

    http://codeforces.com/problemset/problem/735/C 题意..采用淘汰赛制..只要打输就退出比赛..而且只有两个选手打过的场数 相差不超过1才能比赛..最后问你 ...