colspan和rowspan这两个属性用于创建特殊的表格。

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

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

  • rowspan通常使用在td和th标签中
  • 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. 
						
  2. jquery获取表单元素与回显
		
    一.获取哦表单元素 dcoument表单文本对象的集合 all[] 对所有html元素的访问 forms 返回对文档中所有form对象的引用 forms[1] 对所有form对象引用 <scri ...
    
		
    3. 
						
  3. HTML5 学习总结（二）——HTML5新增属性与表单元素
		
    一.HTML5新增属性 1.1.contextmenu contextmenu的作用是指定右键菜单. <!DOCTYPE html> <html> <head> & ...
    
		
    4. 
						
  4. CSS之表单元素
		
    表单就是收集用户信息的,就是让用户填写的.选择的. 1                <div> 2                         <h3>欢迎注册本网站&l ...
    
		
    5. 
						
  5. 表单元素的submit()方法和onsubmit事件
		
    1.表单元素中出现了name="submit"的元素 2.elemForm.submit();不会触发表单的onsubmit事件 3.动态创建表单时遇到的问题 表单元素拥有subm ...
    
		
    6. 
						
  6. HTML5 学习笔记（二）——HTML5新增属性与表单元素
		
    目录 一.HTML5新增属性 1.1.contextmenu 1.2.contentEditable 1.3.hidden 1.4.draggable 1.5.data-* 1.6.placehold ...
    
		
    7. 
						
  7. 【原】如何改变表单元素的外观(for Webkit and IE10)
		
    表单元素在网页设计中使用的非常频繁,如文本输入框.单选框.复选框.选择列表.上传文件,它们在浏览器中的展现有自带的外观,为了在视觉上取得更好的产品体验,保持客户端的统一,通常产品经理会提出需要改变它的 ...
    
		
    8. 
						
  8. MVC中使用内建的HTML辅助方法产生表单元素提交表单与button按钮事件的陷阱
		
    网站模板页有个登陆的退出按钮,当点击时跳转到登陆页面. <button onclick="logout()" >退出</button> $("#l ...
    
		
    9. 
						
  9. [转]CSS 表单元素对齐详解
		
    来源:http://blog.sina.com.cn/s/blog_655388ed0100lzyk.html 简单的设置input{vertical-align:middle}即可,完美的: lab ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. hdu1141(二进制数位，二分，打表)
			
    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1141 题意:××公司是制造computer的,1960年它造的computer是4bit的,之后每10 ...
    
			
    2. 
						
  2. iOS自动更新如何实现
			
    APP检测更新可以使用两种方法.第一种是和安卓等系统一样,获取自己服务器的APP版本号与已安装的APP版本号比较:第二种是根据已发布到app store上的应用版本号与已安装的APP版本号比较更新.第 ...
    
			
    3. 
						
  3. vector 去重复
			
    ①首先将vector排序 sort( vecSrc.begin(), vecSrc.end() ); // 1,2,3,3,4,4,6,7,8,9 ②然后使用unique算法,unique返回值是重复 ...
    
			
    4. 
						
  4. .net学习之Session、Cookie、手写Ajax代码以及请求流程
			
    1.IIS 7 以上版本集成了两种模式,一种是经典模式,一种是集成模式(直接将asp.net框架集成到IIS中) 2.浏览器和服务器端通过什么技术来实现的?Socket(套接字),通信的语法是HTTP ...
    
			
    5. 
						
  5. eclipse中的任务标记(TODO、FIXME、XXX)
			
    eclipse Task Tags: TODO -用来提醒该标识处的代码有待返回继续编写.更新或者添加.该标签通常在注释块的源文件顶部. FIXME -该标签用来提醒你代码中存在稍后某个时间需要修改的 ...
    
			
    6. 
						
  6. 在ubuntu上搭建开发环境4---ubuntu简单的搭建LAMP环境和配置
			
    最近重新安装了Ubuntu,但是之前的LAMP环境自然也就没有了,实在是不想再去编译搭建LAMP环境(这种方法实在是太费时间,而且太容易遇到各种不知道为什么的错误),所以,就去查查有没有什么简单的搭建 ...
    
			
    7. 
						
  7. CentOS版本选择说明
			
    官方下载站http://www.centos.org/download/ 所有版本下载地址http://vault.centos.org/ 首先对一些镜像文件做个简单的介绍: LiveCD一般用来修复 ...
    
			
    8. 
						
  8. [LeetCode] Search Insert Position
			
    Given a sorted array and a target value, return the index if the target is found. If not, return the ...
    
			
    9. 
						
  9. Spring XML配置文件示例（一）——<Servlet name>-servlet.xml
			
    <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://www.sp ...
    
			
    10. 
						
  10. Oracle优化的几个简单步骤
			
    数据库优化的讨论可以说是一个永恒的主题.资深的Oracle优化人员通常会要求提出性能问题的人对数据库做一个statspack,贴出数据库配置等等.还有的人认为要抓出执行最慢的语句来进行优化.但实际情况 ...
    
			
    11.