html简单的表格制作

看一个简单的样例

标题 1 标题 2 标题 3
文字 文字 文字
文字 文字
<table border="1">
    <tr>
        <th align="left">标题 1th>   
        <th align="center">标题 2th> 
        <th align="right">标题 3th>  
    tr>
    <tr>
        <td rowspan="2">col 11td>
        <td>col 12td>
        <td>col 13td>
    tr>
    <tr>
        <td>col 22td>
        <td>col 23td>
    tr>
table>

首先,讲解结构

HTML 表格的基本结构:

<table>table>:定义表格

<th>th>:定义表格的标题栏(文字加粗)
<tr>tr>:定义表格的行

<td>td>:定义表格的列

解析:
也就是说最外层是table,然后由若干个行tr组成,在若干个tr内有若干个列td组成.
标题由th封装
如果不定义边框属性,表格将不显示边框。有时这很有用,但是大多数时候,我们希望显示边框。使用边框属性border来显示一个带有边框的表格.

合并单元格

合并单元格,合并的顺序我们按照 先上 后下 先左 后右 的顺序 ,合并完之后需要删除多余的单元格。

跨行合并:rowspan=“合并单元格的个数”
跨列合并:colspan=“合并单元格的个数”

你可能感兴趣的:(html,前端)