登录名:  密码:  验证码: 7393
设为首页 收藏本站 联系站长
2008年11月21日
农历戊子年(鼠)
十月廿四
 首页 | 最新上传 | 新闻 | 购物商场 | 招聘求职 | HTML学习 | java学习 | IT新闻 | 黑客技术 | 域名和空间 | 流量统计 | 故事小说
 GIF动画制作 | 图片素材 | 源码下载 | 书籍下载 | 视频资料 | ASP | 数据库 | PHP | 基本电脑知识 | 迅雷资源 | 兼职 | 组网工程
 英语学习 | FLASH专区 | ASP.NET | VB | 综合资源网 | 驱动下载 | 游戏下载 | 网站模板网页美工 | 韩文学习 | 论坛
 特别推荐:产品报价  漂亮网站网址  图片素材
  我要查找:  
欢迎您来这里。每天学一点,每天进步一点!
Google
 当前位置:首页 >> HTML学习  >> HTML学习
表格的基本语法
来源:  发表日期:2008年5月5日 作者: 

 编辑:admin 级别: 司令 浏览次数:60
】    

<table>...</table> - 定义表格
<tr> - 定义表行
<th> - 定义表头
<td> - 定义表元(表格的具体数据)

带边框的表格:
<table border>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>      
</table>

Food Drink Sweet
A B C


不带边框的表格:

<table>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>      
</table>

Food Drink Sweet
A B C

+ 跨多行、多列的表元(Table Span)

跨多列的表元 <th colspan=#>

<table border>
<tr><th colspan=3> Morning Menu</th>
<tr><th>Food</th>       <th>Drink</th>  <th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>

Morning Menu
Food Drink Sweet
A B C

跨多行的表元 <th rowspan=#>

<table border>
<tr><th rowspan=3> Morning Menu</th>
        <th>Food</th> <td>A</td></tr>
<tr><th>Drink</th> <td>B</td></tr>
<tr><th>Sweet</th> <td>C</td></tr>
</table>

Morning Menu Food A
Drink B
Sweet C

+ 表格尺寸设置

<table border=#>

边框尺寸设置:
<table border=10>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>      
</table>

Food Drink Sweet
A B C

<table border width=# height=#>

表格尺寸设置:
<table border width=170 height=100>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>      
</table>

Food Drink Sweet
A B C

<table border cellspacing=#>

表元间隙设置:
<table border cellspacing=10>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>      
</table>

Food Drink Sweet
A B C

<table border cellpadding=#>

表元内部空白设置:
<table border cellpadding=10>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>      
</table>

Food Drink Sweet
A B C

+ 表格内文字的对齐/布局

<tr align=#>

<th align=#> #=left, center, right

<td align=#>

<table border width=160>
<tr>
                <th>Food</th><th>Drink</th><th>Sweet</th>
<tr>
                <td align=left>A</td>
                <td align=center>B</td>
                <td align=right>C</td>  
</table>

Food Drink Sweet
A B C

<tr valign=#>

<th valign=#> #=top, middle, bottom, baseline

<td valign=#>

<table border height=100>
<tr>
                <th>Food</th><th>Drink</th>
                <th>Sweet</th><th>Other</th>
<tr>
                <td valign=top>A</td>
                <td valign=middle>B</td>
                <td valign=bottom>C</td>
                <td valign=baseline>D</td>
</table>

Food Drink Sweet Other
A B C D

+ 表格在页面中的对齐/布局(Floating Table)

<table align=left>

<table align="left" border>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>
My favorites...<br>
cookies, chocolates, and more.
Food Drink Sweet
A B C

My favorites...
cookies, chocolates, and more.


<table align=right>

Food Drink Sweet
A B C

My favorites...
cookies, chocolates, and more.


<table vspace=# hspace=#> #=space value

<table align="left" border vspace=20 hspace=30>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>
</table>
My favorites...<br>
cookies, chocolates, and more.
Food Drink Sweet
A B C

My favorites...
cookies, chocolates, and more.


+ 表格的标题

<caption align=#> ... </caption> #=left, center, right

<table border>
<caption align=center>Lunch</caption>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>      
</table>

Lunch

Food Drink Sweet
A B C

<caption valign=#> ... </caption> #=top, bottom

  • valign=top is default.
<table border>
<caption valign=bottom>Lunch</caption>
<tr><th>Food</th><th>Drink</th><th>Sweet</th>
<tr><td>A</td><td>B</td><td>C</td>      
</table>

Lunch

Food Drink Sweet
A B C

(编辑:网站学习网)
 ·上一篇文章: marquee
 ·下一篇文章: 表格进阶(TABLE ADVANCED)
 该篇文章的评论
 暂无相关评论
 姓名:  邮箱:
 内容:
                
 相关文章
 · html基础入门教程下载
 · 怎样控制文本输入框中字
 · HTML帖子制作教程:前言
 · HTML帖子制作教程:字体
 · 今天是19日想把网站首页
 · HTML语言教程:版面风格
 · CSS语法
 · HTML语言教程:分框&nbs
 · HTML2.0 字符实体名
 · HTML语言教程:表格(Tab
 · 基础知识_清华大学版
 最新上传文章
 · 吉列剃须刀
 · phpmyadmin安装中"
 · 安装,启动与卸载Mysql系
 · 如何构建php运行环境,支
 · 抢注行为频起风波 
 · 几款常用路由器端口映射
 · MySQL实用命令
 · 阎月明马不停蹄忙公益
 · “百变金刚”演艺人——
 · 谢东娜:“白雪公主”的
 · 张英 :《幸福的完

服务说明 | 关于网站 | 联系我们 | 友情链接
网站学习网欢迎您!
http://www.studywebgood.com
浙ICP备07030755号 
联系邮箱:shuizhilang@126.com 如本网站侵犯了您的版权,请马上通知我.