HTML回顾01

 

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>表格</title>

<style>

/* 标签选择器 元素选择器 */

table{

border: 1px solid #666;

/* 合并边框 */

border-collapse: collapse;

width: 400px;

}

th,td{

border: 1px solid #666;

}

</style>

</head>

<body>

<!-- table是块级元素 -->

<!--html注释-->

<!--

border--表格的边框属性

align--表格的对齐方式 left center right

width--表格的宽度 height

cellpadding--表示单元格和内容的距离

cellspacing--表示单元格和单元格之间的距离

bgcolor--表示表格的背景色

-->

<!--

学完css之后就不要使用这些属性了

border="1px" bgcolor="cyan" align="left" width="400px" cellpadding="0" cellspacing="0px" -->

<table>

<tr>

<td>111</td>

<td>222</td>

<td>333</td>

</tr>

<tr>

<td>444</td>

<td>555</td>

<td>666</td>

</tr>

<tr>

<td>777</td>

<td>888</td>

<td>999</td>

</tr>

</table>

<br>

<!-- -->

<table>

<!-- 表头 -->

<!-- th一般用于表头单元格 默认有居中加粗效果 -->

<!-- caption表示表格标题标签 -->

<caption align="right">学生信息表</caption>

<!-- colgroup列分组 column 表示列-->

<colgroup>

<col style="background-color: aqua;">

<col span="2" style="background-color: blue;">

</colgroup>

<thead>

<tr>

<th>姓名</th>

<th>学号</th>

<th>班级</th>

</tr>

</thead>

<!--表体 -->

<tbody>

<tr>

<td>姓名</td>

<td>学号</td>

<td>班级</td>

</tr>

</tbody>

<!-- 表脚 -->

<tfoot>

<tr>

<td>姓名</td>

<td>学号</td>

<td>班级</td>

</tr>

</tfoot>

</table>

</body>

</html>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值