• 表格标签的常用属性,表格的合并,表格的嵌套。


    表格标签的常用属性:

    <!--
    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
  • 相关阅读:
    2018.09.08什么是ajax
    2018.09.03怎样让网页自适应所有屏幕宽度
    2018.08.25字符串和二维数组之间的转换
    2018.08.20MySQL常用命令总结(二)
    2018.08.15解决MySQL1290问题
    2018.08.13MySQL常用命令总结(一)
    2018.08.11MySQL无法启动错误码1067的解决方法
    2018.08.10 css中position定位问题
    2018.08.10jQuery导航栏置顶
    2018.08.07css实现图片放大
  • 原文地址:https://www.cnblogs.com/wf293/p/14806191.html
Copyright © 2020-2023  润新知