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>

    天道酬勤,厚积薄发。 君子之行,静以修身,俭以养德。 非淡泊无以明志,非宁静无以致远。 如有恒,何须三更起,半夜眠;最怕莫,三天打鱼两天晒网,竹篮打水一场空。
  • 相关阅读:
    nginx 负载均衡配置
    nginx 配置优化详解
    duilib -- Label控件的bug(转载)
    Duilib实现GroupBox控件
    Duilib动画按钮实现(转载)
    Duilib中Webbrowser事件完善使其支持判断页面加载完毕
    Duilib实现圆形头像控件
    duilibutilsutils.h(251) : error C2504: “VARIANT”: 未定义基类
    软件项目版本号的命名规则及格式
    c++中char*wchar_t*stringwstring之间的相互转换
  • 原文地址:https://www.cnblogs.com/houweidong/p/7478386.html
Copyright © 2011-2022 走看看