HTML的常用标签(五)- 表格

1、表格的作用

表格通常来组织结构化的信息,把数据村塾在单元格里

2、如何构建一个表格

    <table>                    ----------表格

         <tr>               ----------行

                        <th>内容</th>   ----------单元格(加粗)

                        <td>内容</td>   ----------单元格

                        <td>内容</td>

           </tr>

  </table>

3、表格的属性

      属性名称               属性值                                说明

      width                      数值                                  设置表格宽度

      height                    数值                                  设置表格高度

      bgcolor                  英文颜色                         设置表格背景颜色

                                     rgb('255,255,255')

                                    十六位进制数

      background          图像地址                       设置表格北京图像(与bgground同事用,background的优                                                                        先级较高)

      border                    数值                                  设置表格边框宽度

      bordercolor             英文颜色                              设置表格边框颜色

                                     rgb('255,255,255')

                                    十六位进制数

      cellpadding          数值                                  设置内边距(单元格边框与内容之间的距离)

      cellspacing            数值                                  设置外边距(单元格之间的距离)

      align                      对齐方式(left|center|right)         设置对齐方式


4、行属性


      属性名称            属性值                                          说明

      align                 对齐方式(left|center|right)         设置对齐方式

      bgcolor             英文颜色                                        设置表格背景颜色

                                rgb('255,255,255')

                                 十六位进制数

      valign                对齐方式(left|center|right)         设置垂直对齐方式


5、单元格属性


      属性名称       属性值                                说明

      align               对齐方式(left|center|right)         设置对齐方式

      bgcolor        英文颜色                              设置表格背景颜色

                            rgb('255,255,255')

                              十六位进制数

      valign               对齐方式(left|center|right)         设置垂直对齐方式

      rowspan        数值                                  设置行合并

      colspan        数值                                  设置列合并


6、表格嵌套

<body>

<table border="1" cellpadding="10" cellspacing="0">

<tr>

<td><img src="1.jpg" alt="" title="启动页"/></td>

<td valign="top">

<table border="1" cellpadding="10" cellspacing="0" bgcolor="#999999">

<tr>

<td colspan="2">JEEP牧马人</td>

</tr>

<tr>

<td>厂商</td>

<td>JEEP</td>

</tr>

<tr>

<td>车型</td>

<td>中型SUV</td>

</tr>

<tr>

<td>变速箱</td>

<td>5档手自合一</td>

</tr>

<tr>

<td>最高车速</td>

<td>240km/h</td>

</tr>

<tr>

<td>发动机</td>

<td>涡轮增压</td>

</tr>

<tr>

<td>燃料</td>

<td>柴油</td>

</tr>

<tr>

<td>环保标准</td>

<td>国V</td>

</tr>

</table>

</td>

</tr>

</table>

</body>

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 0.B/S结构 浏览器服务器模式,web浏览器是客户端最主要的应用软件.将客户端使用web进行统一,系统功能实现集...
    liusong007阅读 1,090评论 0 1
  • 学习CSS的最佳网站没有之一 http://www.w3school.com.cn/tags/index.asp ...
    Amyyy_阅读 1,101评论 0 1
  • 1.块级元素和行内元素 块级(block-level)元素;行内(内联、inline-level)元素。 块元素的...
    饥人谷_小侯阅读 2,055评论 1 4
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,815评论 1 92
  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 3,331评论 1 41