专注收集记录技术开发学习笔记、技术难点、解决方案
网站信息搜索 >> 请输入关键词:
您当前的位置: 首页 > HTML/CSS

HTML&CSS基础学习笔记1.16-单元格间隔和表格主体

发布时间:2010-05-20 14:01:29 文章来源:www.iduyao.cn 采编人员:星星草
HTML&CSS基础学习笔记1.16-单元格间距和表格主体

上一篇讲html学习笔记,讲过了合并单元格,那么今天就来介绍下如何控制单元格的间距,以及表格主体的相关知识。

单元格间距

在上个知识点的显示结果中你可能发现了,单元格与单元格之间有一小段空白。这是由<table>的[cellspacing]属性控制的:

<!DOCTYPE html>  <htmllang="en">  <head>      <metacharset="UTF-8">      <title>单元格间距 cellspacing</title>  </head>  <body>      <h2>观察cellspacing的作用</h2>      <tableborder="1"cellspacing="1">          <tr><td>第一个单元格</td><td>第二个单元格</td><td>第三个单元格</td></tr>          <tr><td>第四个单元格</td><td>第五个单元格</td><td>第六个单元格</td></tr>          <tr><td>第七个单元格</td><td>第八个单元格</td><td>第九个单元格</td></tr>      </table>  </body>  </html>  

 

这种情况下的表格是这样的:


 

表格的主体

在我们经常使用的数据表格中,并不是所有行都表示数据,一般第一行会定义一些表头的信息,后面才是表格的正文主体,如:

如下代码是<tbody>标签的使用方法:

<table>  <tbody>    <tr>      <td>主体</td>     </tr>  </tbody></table>

 现在就让我们使用下tbody标签吧:

<!DOCTYPE html><htmllang="en"><head>    <metacharset="UTF-8">    <title>使用tbody标签</title></head><body>    <h1>使用tbody标签</h1>    <tableborder="1">        <tbody>        <tr><td>第一个单元格</td><td>第二个单元格</td></tr>        <tr><td>第三个单元格</td><td>第四个单元格</td></tr>    </table></body></html>

 结果如何呢?


 

更多学习内容就在码芽网http://www.mayacoder.com/lesson/index

1 楼 octopole 2016-08-03 欢迎学习~~~
友情提示:
信息收集于互联网,如果您发现错误或造成侵权,请及时通知本站更正或删除,具体联系方式见页面底部联系我们,谢谢。

其他相似内容:

热门推荐: