zoukankan      html  css  js  c++  java
  • html5-表格

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>表格</title>
    </head>
    <body>
    <table border="1">
    <caption>表格标题</caption>
        <tr><th>标题</th><th>标题</th><th>标题</th></tr>
        <tr><td>1</td><td>2</td><td>3</td></tr>
        <tr><td>1</td><td>2</td><td>3</td></tr>
        <tr><td>1</td><td>2</td><td>3</td></tr>
        <tr><td>1</td><td>2</td><td>3</td></tr>
        <tr><td>1</td><td>2</td><td>3</td></tr>
    </table>
        <table border="3">
        <caption>表格标题</caption>
            <tr><th colspan="3">标题合并</th></tr>
            <tr><td>1</td><td>2</td><td>3</td></tr>
            <tr><td colspan="2">12合并</td><td>3</td></tr>
            <tr><td>1</td><td>2</td><td>3</td></tr>
            <tr><td rowspan="3">1</td><td>2</td><td>3</td></tr>
            <tr><td>2</td><td rowspan="2">3</td></tr>
            <tr><td>2</td></tr>
        </table>
        <table border="1">
            <tr><th>标题</th><th>标题</th><th>标题</th><th>标题</th><th>标题</th></tr>
            <tr><td>a</td><td>a</td><td>a</td><td>a</td><td>a</td></tr>
            <tr><td>a</td><td>a</td><td>a</td><td>a</td><td>a</td></tr>
            <tr><td>a</td><td>a</td><td>a</td><td>a</td><td>a</td></tr>
            <tr><td>a</td><td>a</td><td>a</td><td>a</td><td>a</td></tr>        
        </table>
        <table border="1">
        <thead style="background: green">
            <tr><th colspan="5">标题</th></tr>
        </thead>
            <tbody style="background: red">
                <tr><td>a</td><td>a</td><td>a</td><td>a</td><td>a</td></tr>
                <tr><td>a</td><td>a</td><td>a</td><td>a</td><td>a</td></tr>
                <tr><td>a</td><td>a</td><td>a</td><td>a</td><td>a</td></tr>
            </tbody>
            <tfoot></tfoot>
                <tr><td>备注</td><td colspan="4">a</td></tr>    
            </tfoot>    
        </table>
        <table border="1">
         <colgroup span="1" style=" 150px"></colgroup>
         <colgroup span="3" style=" 50px"></colgroup>
         <colgroup span="1" style=" 300px"></colgroup>
            <tr><th>标题</th><th>标题</th><th>标题</th><th>标题</th><th>标题</th></tr>
            <tr><td>a</td><td>a</td><td>a</td><td>a</td><td>a</td></tr>
            <tr><td>a</td><td>a</td><td>a</td><td>a</td><td>a</td></tr>
            <tr><td>a</td><td>a</td><td>a</td><td>a</td><td>a</td></tr>
            <tr><td>a</td><td>a</td><td>a</td><td>a</td><td>a</td></tr>        
        </table>

        <table border="1">
        <colgroup span="1" style=" 150px">
            <col style="background: green">
        </colgroup>
        <colgroup span="3" style=" 300px">
            <col style="background: red">
            <col style="background: green">
            <col style="background: red">
        </colgroup>
            <tr><th>标题</th><th>标题</th><th>标题</th><th>标题</th><th>标题</th></tr>
            <tr><td>a</td><td>a</td><td>a</td><td>a</td><td>a</td></tr>
            <tr><td>a</td><td>a</td><td>a</td><td>a</td><td>a</td></tr>
            <tr><td>a</td><td>a</td><td>a</td><td>a</td><td>a</td></tr>
            <tr><td>a</td><td>a</td><td>a</td><td>a</td><td>a</td></tr>        
        </table>
    </body>
    </html>

    天道酬勤,厚积薄发。 君子之行,静以修身,俭以养德。 非淡泊无以明志,非宁静无以致远。 如有恒,何须三更起,半夜眠;最怕莫,三天打鱼两天晒网,竹篮打水一场空。
  • 相关阅读:
    HTTP协议中GET、POST和HEAD的介绍
    Django model 字段类型清单
    MySQL的菜鸟级操作
    windows7下将Cygwin加入右键菜单,并从当前目录打开
    数组指针和指针数组的区别
    const引用与非const引用
    printf("33[1;33m ***** 33[0m ");
    C语言可变参数函数详解示例
    机顶盒demux的工作原理
    机顶盒的工作原理
  • 原文地址:https://www.cnblogs.com/houweidong/p/7478386.html
Copyright © 2011-2022 走看看