HTML table 直列化格式详解

小蚂蚁

直列化格式
<colgroup>...</colgroup>
属性名称                                        属性值                         说明
align                                           left                                              靠左
                                                center                                           靠中
                                                right                                              靠右
valign                                        top                                                 靠上
                                                middle                                           靠中
                                                bottom                                           靠下
span                                        数字                                              直列数
bgcolor                                     颜色                                              背景颜色
个别直列设置
格式:<col>功能完全和<colgroup>一样

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   
     
  <html xmlns="https://www.w3.org/1999/xhtml">   
  <head>   
    <title>表格的直列化格式</title>   
  </head>   
  <body>   
    <table cellpadding="5px" cellspacing="0px" border="1px" bordercolor="black">   
      <!--说明：用两组colgroup标签来控制整个第三列显示为红色  
        第一组colgroup中的span="2"相当于一个占位符，这样第三列(数学这一整列)就会显示为红色  
        同理，如果设置span="3",则第四列(英语这一整列)会显示为红色  
        <colgroup span="2"></colgroup>   
        <colgroup bgcolor="red"></colgroup>   
      -->   
      <!--<col>功能完全和<colgroup>一样  
        设置<col>标签达到和<colgroup>一样的功能  
        这里加了一个align="right"单独设置第三列(数学这一整列)右对齐  
      -->   
      <col span="2" />   
      <col bgcolor="red" align="right" />   
      <caption align="left">学生成绩表</caption>   
      <tr>   
        <th>姓名</th>   
        <th>语文</th>   
        <th>数学</th>   
        <th>英语</th>   
      </tr>   
      <tr>   
        <td>张三</td>   
        <td>90</td>   
        <td>89</td>   
        <td>99</td>   
      </tr>   
      <tr>   
        <td>李四</td>   
        <td>98</td>   
        <td>92</td>   
        <td>96</td>   
      </tr>   
      <tr>   
        <td>王五</td>   
        <td>92</td>   
        <td>97</td>   
        <td>91</td>   
      </tr>   
      <tr>   
        <td>总分</td>   
        <td>200</td>   
        <td>200</td>   
        <td>200</td>   
      </tr>   
    </table>   
  </body>   
  </html>

以上就是小编为大家带来的HTML table 直列化格式详解的全部内容了，希望对大家有所帮助，多多支持CodeAE代码之家~

[Html/CSS] HTML table 直列化格式详解

相关帖子

HTML 表格简介

教你使用HTML/CSS和Three.js的喷火龙小游戏

基于 HTML+CSS+JS 的石头剪刀布游戏

HTML/JS/PHP网站底部获取当前年份代码

html+Js获取当前时间代码

nginx启ssi方法，宝塔面板nginx开启ssi

常用HTML网页跳转的几种方法

CSS3荧光灯文字闪烁动画特效

利用html+js触发弹窗事件

利用HTML、CSS和JS制作随机密码生成器

小蚂蚁 LV3