码迷,mamicode.com
首页 > Web开发 > 详细

Html中的表格

时间:2017-07-06 12:21:56      阅读:196      评论:0      收藏:0      [点我收藏+]

标签:表示   lin   ges   技术   内容   单元格   bottom   lsp   htm   

表格由<table>标签来定义。每个表格均有若干行(由<tr> 标签定义),每行被分割为若干单元格(由<td>标签定义)。

字母 td 指表格数据(table data),即数据单元格的内容。数据单元格可以包含文本、图片、列表、段落、表单、水平线、表格等等。

 

HTML 表格的组成

table:包含表格,表格的开始。

tr:表格的行

th:表格的开头

td:表格的数据

 

属性:

cellpadding:表示内容与表格之间的间隙。

cellspacing:单元格之间和单元格与边框的的间隙。

border:设置边框,颜色,边框线,大小等

align:设置内容对齐方式

 

td跨行跨列通过 rowspan 和colspan来实现

案例 如下图:

      技术分享

  代码中可以看出相关的属性设置

 

<table cellpadding="15" cellspacing="11px" border="1" width="600px" align="center">
            <caption><h3>表名称</h2></caption>
            <tr>
                <th align="left">字段名</th><th>字段名</th><th>字段名</th>
            </tr>
            <tr bgcolor="#008000">
                <td align="center">数据</td><td>数据</td><td>数据2</td>
            </tr>
            
            <tr>
                <td height="88">数据</td><td>数据</td><td>数据</td>
            </tr>
            <tr>
                <td>数据</td><td colspan="2">数据</td>
            </tr>
            <tr>
                <td>数据s</td><td rowspan="2" valign="bottom">数据</td><td>数据</td>
            </tr>
            <tr>
                <td>数据</td><td>数据</td>
            </tr>
            <tr>
                <td >数据</td>
                <td>
                    <table width="100%" height="100%" border="1"   >
                        <tr>
                            <th>字段名</th><th>字段名</th><th>字段名</th>
                        </tr>
                        <tr bgcolor="#008000">
                            <td>数据</th><td>数据</td><td>数据2</td>
                        </tr>
                    </table>
                </td>
                <td>数据</td>
            </tr>
        </table>

 

Html中的表格

标签:表示   lin   ges   技术   内容   单元格   bottom   lsp   htm   

原文地址:http://www.cnblogs.com/zhangqie/p/7125475.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!