zoukankan      html  css  js  c++  java
  • 比较完整的CSS定义表格样式

    一直使用表格内部的属性定义,但是vs编辑器老是进行检查,决定使用css来定义。网上正好有现成的,放在这里做个参考。

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   
    <html xmlns="http://www.w3.org/1999/xhtml">   
    <head>   
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />   
    <title>Table Style</title>   
    <style>   
    #browser{   
    700px;   
    margin:0 auto;   
    border-collapse:collapse;   
    font-family:Arial, Helvetica, sans-serif;   
    text-align:center;   
    }   
    #browser th,td{   
    border:1px solid #aaa;   
    }   
    #browser thead th{   
    border-bottom:2px solid #3d580b;   
    background-color:#8fc629;   
    color:#fff;   
    padding:10px 0px;   
    }   
    #browser th{   
    background-color:#f2f4b9;   
    }   
    #browser th.title{   
    background-color:#e3e685;   
    }   
    #browser tfoot td{   
    border-0px;   
    text-align:rightright;   
    font-size:12px;   
    color:#777;   
    }   
    #browser caption{   
    font-weight:bold;   
    padding:6px 0px;   
    color:#3d580b;   
    font-size:25px;   
    }   
    #xhtml th.title{   
    background-color:#ffd56c;   
    }   
    #xhtml th{   
    background-color:#ffe8ae;   
    }   
    </style>   
    </head>   
    <body>   
    <h1>Table Style</h1>   
    <hr />   
    <table id="browser">   
    <caption>浏览器兼容性一览表</caption>   
    <thead>   
    <tr>   
    <th>CSS特征</th>   
    <th>MSIE 6.0 </th>   
    <th>FF 1.0 </th>   
    <th>FF 1.5 </th>   
    <th>OP 8.5 </th>   
    </tr>   
    </thead>   
    <tbody id="html">   
    <tr>   
    <th colspan="5" class="title">HTML 4.01</th>   
    </tr>   
    <tr>   
    <th>a</th>   
    <td>81%</td>   
    <td>85%</td>   
    <td>85%</td>   
    <td>94%</td>   
    </tr>   
    <tr>   
    <th>abbr</th>   
    <td>N</td>   
    <td>97%</td>   
    <td>85%</td>   
    <td>94%</td>   
    </tr>   
    <tr>   
    <th>acronym</th>   
    <td>94%</td>   
    <td>97%</td>   
    <td>97%</td>   
    <td>75%</td>   
    </tr>   
    </tbody>   
    <tbody id="xhtml">   
    <tr>   
    <th colspan="5" class="title">XHTML 1.0 changes</td>   
    </tr>   
    <tr>   
    <th>HTML in XML </th>   
    <td>N</td>   
    <td>Y</td>   
    <td>Y</td>   
    <td>Y</td>   
    </tr>   
    <tr>   
    <th>well-formed</th>   
    <td>Y</td>   
    <td>Y</td>   
    <td>Y</td>   
    <td>Y</td>   
    </tr>   
    <tr>   
    <th>Media Types </th>   
    <td>N</td>   
    <td>Y</td>   
    <td>Y</td>   
    <td>Y</td>   
    </tr>   
    </tbody>   
    <tfoot>   
    <tr>   
    <td colspan="5">资料来源 http://rlog.cn%3c/td>   
    </tr>   
    </tfoot>   
    </table>   
    </body>   
    </html> 

  • 相关阅读:
    stl rope
    vijos1574 摇钱树
    图论 Dijkstra+堆优化
    c++输入优化
    Vijos1579 宿命的PSS 最小生成树
    快速求n阶多项式乘积
    c++stl map
    C#函数式程序设计之惰性列表工具——迭代器
    C#函数式程序设计之泛型(下)
    C#函数式程序设计之泛型(上)
  • 原文地址:https://www.cnblogs.com/fslnet/p/1644291.html
Copyright © 2011-2022 走看看