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>

    天道酬勤,厚积薄发。 君子之行,静以修身,俭以养德。 非淡泊无以明志,非宁静无以致远。 如有恒,何须三更起,半夜眠;最怕莫,三天打鱼两天晒网,竹篮打水一场空。
  • 相关阅读:
    数据挖掘、机器学习、人工智能学习笔记
    SQL Server 定价及授权方式
    数据仓库的架构以及数据分层【转】
    java各历史版本官网下载
    VMware三个版本workstation、server、esxi的区别
    顶级项目孵化的故事系列——Kylin的心路历程【转】
    Oracle数据库学习笔记
    数据仓库学习笔记
    多维数据库介绍【转】
    ROLAP、MOLAP和HOLAP区别
  • 原文地址:https://www.cnblogs.com/houweidong/p/7478386.html
Copyright © 2011-2022 走看看