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. 解决eclipse中maven web工程打包成war(发布到tomcar)时lib中没有jar包的解决方法

    可能有两个原因:1.maven中某些jar包下载不下来 从其他地方下载jar文件放到相应maven本地库的.m2里2..classpath文件中缺少(下面代码的作用是制定maven的jar发布路径)& ...

  2. 4.1 pair类模板

    在学习关联容器之前,首先先要了解一下STL中的pair类模板,因为关联容器的一些成员函数返回值都是pair对象,而且map 和multimap中的元素都是pair对象. 1)pair类模板定义 pai ...

  3. spring刚开始学习搭建

    下载的软件包地址: http://repo.springsource.org/libs-release-local/org/springframework/spring 用maven进行快速开始: h ...

  4. 20145206邹京儒《Java程序设计》第3周学习总结

    20145206 <Java程序设计>第3周学习总结 教材学习内容总结 第四章 4.1 定义类 class Clothes{ String color; char size; } publ ...

  5. Label Font 字体样式设置

    label.font = [UIFont fontWithName:@"Arial-BoldItalicMT" size:24]; 字体名如下: Font Family: Amer ...

  6. MVC – 8.Razor 布局

    8.1.@RenderBody() 8.2.多个"占位符":@RenderSection() 8.3.js合并 @Scripts.Render("~/bundles/js ...

  7. Android 5.0 如何正确启用isLoggable(一)__使用详解

    转自:http://blog.csdn.net/yihongyuelan/article/details/46409389 isLoggable是什么 在Android源码中,我们经常可以看到如下代码 ...

  8. 图结构练习——最短路径(floyd算法(弗洛伊德))

    图结构练习——最短路径 Time Limit: 1000ms   Memory limit: 65536K  有疑问?点这里^_^ 题目描述  给定一个带权无向图,求节点1到节点n的最短路径.   输 ...

  9. 如何观察JS的事件队列的执行划分

    也就是说,不同的操作函数,操作符,JS将其放入事件队列是不一样的... 比如: 外部函数和内部函数,就是分两次放入事件循环的尾端的. 比如,多个操作符组成的链式操作,也有可能是放不同的操作批次进入事件 ...

  10. float 的有效数字为七位是怎么得出来的

    以下内容来自CSDN网友xian_wwq的回答(http://bbs.csdn.net/topics/390874239): float:   1bit(符号位) 8bits(指数位) 23bits( ...