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>

    天道酬勤,厚积薄发。 君子之行,静以修身,俭以养德。 非淡泊无以明志,非宁静无以致远。 如有恒,何须三更起,半夜眠;最怕莫,三天打鱼两天晒网,竹篮打水一场空。
  • 相关阅读:
    原生JS发送Ajax请求、JSONP
    python Flask中html模版中如何引用css,js等资源
    python 单例与数据库连接池 及相关选择
    费曼致学生真野光一
    Winform判断EventHandler是否已经添加
    The list of pre-build cross-compiler
    Extended VM Disk In VirtualBox or VMware (虚拟机磁盘扩容)
    一张图了解SSH端口转发
    显卡驱动卸载清理工具
    Oracle分析函数
  • 原文地址:https://www.cnblogs.com/houweidong/p/7478386.html
Copyright © 2011-2022 走看看