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. xmpp-笔记3
			
    一.了解XMPP 协议(标准) XMPP 即时通讯协议 SGIP 短信网关协议 这手机发短信 移动支付和网页支付 0x23232[0,1] 0x23232 0x23232 0x23232 只有协议,必 ...
    
			
    2. 
						
  2. 利用android来赚钱
			
    看了一篇fenger 大神写的文章,受益匪浅,在此做一下记录 转载地址:http://bbs.csdn.net/topics/370249613 其他参考地址: http://bbs.gfan.com ...
    
			
    3. 
						
  3. Codeforces Round #327 (Div. 2)B（逻辑）
			
    B. Rebranding time limit per test 2 seconds memory limit per test 256 megabytes input standard input ...
    
			
    4. 
						
  4. hdu 1279 验证角谷猜想
			
    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1279 #include<stdlib.h> #include<time.h>  ...
    
			
    5. 
						
  5. js  闭包原理理解
			
    问题?什么是js(JavaScript)的闭包原理,有什么作用? 一.定义 官方解释:闭包是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分. 很显然 ...
    
			
    6. 
						
  6. C#接扣和抽象类
			
    什么是接口? 接口是包含一组虚方法的抽象类型,其中每一种方法都有其名称.参数和返回值.接口方法不能包含任何实现,CLR允许接口可以包含事件.属性.索引器.静态方法.静态字段.静态构造函数以及常数.但是 ...
    
			
    7. 
						
  7. 并发中的Native方法，CAS操作与ABA问题
			
    Native方法,Unsafe与CAS操作 >>JNI和Native方法 Java中,通过JNI(Java Native Interface,java本地接口)来实现本地化,访问操作系统底 ...
    
			
    8. 
						
  8. ***电商数据库设计参考：ecshop数据库+订单表结构等
			
    ecshop订单表结构ecs_order_info说明 -- 表的结构 `ecs_order_info`    CREATE TABLE IF NOT EXISTS `ecs_order_info`  ...
    
			
    9. 
						
  9. ASP.NET MVC 使用带有短横线的html Attributes（转载）
			
    转载地址:http://www.nmtree.net/2013/10/25/asp-net-mvc-use-dash-in-html-attributes.html 情景再现 我们常常需要一个文本框来 ...
    
			
    10. 
						
  10. Delphi之DLL知识学习4---创建DLL
			
    下面是在Delphi中创建一个DLL的全过程,你将看到怎样创建一个接口单元,使之可以被其他的应用程序访问.并且将学会怎么把Delphi的窗体加入DLL中. 一.数美分:一个简单的DLL 下面是包含一个 ...
    
			
    11.