Html5 1.2 table元素的使用

最新推荐文章于 2021-06-05 04:51:43 发布

LetsStudy

最新推荐文章于 2021-06-05 04:51:43 发布

阅读量331

点赞数

分类专栏： Html Note

本文链接：https://blog.csdn.net/LetsStudy/article/details/81946488

版权

Html Note 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

一、table元素

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta title="test">
    <title>Title</title>
    <style type="text/css">
        tr{
            text-align: center;
        }
    </style>
</head>
<body>
    <table border="2" width="360"  ><!--border边框，th标题，tr行，td列，colspan跨列合并单元格，rowspan跨行合并单元格
    caption废弃了-->
        <caption>表格标题</caption>
        <tr><th>1</th><th>2</th><th>3</th><th>4</th></tr>
        <tr align="center"><td>5</td><td>6</td><td>7</td><td>8</td></tr>
        <tr><td colspan="3"></td><td>9</td></tr>
        <tr><td colspan="4" height="20px"></td></tr>
    </table>
    <br>
<table border="2" width="360" >
    <tr><th rowspan="2">标题1</th><th>标题2</th><th>标题3</th><th>标题4</th></tr><!--标题1将占据两行-->
    <tr><td>6</td><td>7</td><td>8</td></tr>
    </table>
    <br>
<table border="2">
    <tr><th>标题1</th><th>标题2</th><th>标题3</th><th>标题4</th><th>标题5</th></tr>
    <colgroup span="1" style="width:100px"></colgroup><!--colgroup对表格列进行分组，span定义分组的列数，style定义列宽-->
    <colgroup span="3" style="width: 240px"></colgroup>
    <colgroup span="1" style="width: 100px"></colgroup>
    <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
    <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
    <tr><td>1</td><td>2</td><td>3</td><td>4</td><td>5</td></tr>
</table>
</body>
</html>

二、效果展示

LetsStudy

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Html5 1.2 table元素的使用

一、table元素&lt;!DOCTYPE html&gt;&lt;html lang="en"&gt;&lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta title="test"&gt; &lt;title&gt;Title&lt;/title&gt;
复制链接

扫一扫

专栏目录