zoukankan      html  css  js  c++  java
  • 表格标签的常用属性,表格的合并,表格的嵌套。

    表格标签的常用属性:

    <!--
    table常用属性:border指定边框;width指定宽度;height指定高度;bgcolor指定背景颜色;align对齐方式;
    tr标签:代表行
    td标签:代表列
    -->
    <table border="1px" width="400px" bgcolor="beige" align="center">
    <tr bgcolor="blue" align="center">
    <td>1</td>
    <td>1</td>
    <td>1</td>
    <td>1</td>
    <td>1</td>
    </tr>
    <tr>
    <td>1</td>
    <td>1</td>
    <td>1</td>
    <td>1</td>
    <td>1</td>
    </tr>

    </table>

    表格的合并:

    <!--表格的合并
    列合并用:colspan,合并几列就给合并的那一列后面赋值几,占掉谁的格子就需要把谁删掉
    行合并用:rowspan,合并几行就给合并的那一行后面赋值几,占掉谁的格子就需要把谁删掉
    -->
    <table border="1px" width="400px" height="1px">
    <tr>
    <td colspan="2">2</td>

    <td>2</td>
    <td>2</td>
    </tr>
    <tr>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td rowspan="3">2</td>
    </tr>
    <tr>
    <td>2</td>
    <td>2</td>
    <td>2</td>

    </tr>
    <tr>
    <td>2</td>
    <td>2</td>
    <td>2</td>


    </tr>
    </table>

    表格的嵌套:

    <table border="1px" width="400px" height="1px">
    <tr>
    <td colspan="2">2</td>

    <td>2</td>
    <td>2</td>
    </tr>
    <tr>
    <td>2</td>
    <td>2</td>
    <td>2</td>
    <td rowspan="4">
    <table border="1px" width="100%" height="1px">
    <tr>
    <td>3</td>
    <td>3</td>
    <td>3</td>
    <td>3</td>
    </tr>
    <tr>
    <td>3</td>
    <td>3</td>
    <td>3</td>
    <td>3</td>
    </tr>
    <tr>
    <td>3</td>
    <td>3</td>
    <td>3</td>
    <td>3</td>
    </tr>
    <tr>
    <td>3</td>
    <td>3</td>
    <td>3</td>
    <td>3</td>
    </tr>
    </table>
    </td>

    </tr>
    <tr>
    <td>2</td>
    <td>2</td>
    <td>2</td>

    </tr>
    <tr>
    <td>2</td>
    <td>2</td>
    <td>2</td>


    </tr>
    <tr>
    <td>2</td>
    <td>2</td>
    <td>2</td>

    </tr>
    </table>

    添加微信进交流群: opiopi293
  • 相关阅读:
    深入理解 Netty编码流程及WriteAndFlush()的实现
    深入理解 Netty-解码器架构与常用解码器
    暑假集训Day 5 P3963 [TJOI2013] 奖学金
    暑假集训日记Day xx
    P3226 [HNOI2012]集合选数 状压dp(思维题)
    线段树(毒瘤)总结
    P3622 [APIO2007]动物园
    暑假集训Day 4 P4163 [SCOI2007]排列 (状压dp)
    暑假集训Day2 互不侵犯(状压dp)
    暑假集训Day2 状压dp 特殊方格棋盘
  • 原文地址:https://www.cnblogs.com/wf293/p/14806191.html
Copyright © 2011-2022 走看看