HTML表格基础与应用

需积分: 9 180 浏览量更新于2024-08-01 收藏 4.86MB PPT 举报

"北大青鸟html课件2" 在学习HTML时，表格是一个重要的元素，尤其在构建网页布局和展示数据时。本章主要讲解了HTML表格的基础知识，包括表格的构成、基本语法以及如何创建和美化表格。首先，回顾HTML标签的特性：HTML标签一般不区分大小写，但为了代码规范，通常建议使用小写字母。HTML的基本结构包括文档类型声明（<!DOCTYPE html>），html标签（<html>...</html>），head标签（<head>...</head>）用于存放元信息如标题、CSS样式等，body标签（<body>...</body>）则包含网页的主要内容。页面链接有多种类型，如内部链接（链接同一网页内的不同位置）、外部链接（链接到其他网站）和锚点链接（链接到页面内的特定位置）。超链接的基本格式是：<a href="链接地址">链接文字</a>，其中href属性指定链接的目标，链接文字是用户点击的部分。预习检查中提到，表格由行（<tr>...</tr>）和列（<td>...</td>）组成，创建一个基本的表格至少需要<table>、<tr>和<td>标签。本章的任务是制作两个不同的页面，并掌握使用表格相关标签来实现复杂布局，如跨行、跨列，以及进行美化修饰。表格在各种类型的网站中都有广泛应用，例如论坛、门户网站和购物网站。在论坛中，表格常用于展示版块分类；在门户网站上，表格可以用于排列新闻或信息；而在购物网站，商品列表通常以表格形式展示。表格的基本结构包括<TABLE>标签用于定义表格，<TR>标签定义行，而<TD>标签定义列。border属性用于设置表格边框的尺寸，例如<TABLE border="2">将创建一个边框宽度为2像素的表格。创建一个简单的表格，如以下示例： ``` <TABLE border="2"> <TR> <TD>移动</TD> <TD>联通</TD> <TD>铁通</TD> </TR> <TR> <TD>IBM</TD> <TD>惠普</TD> <TD>华硕</TD> </TR> </TABLE> ``` 跨行跨列的表格可以通过使用COLSPAN和ROWSPAN属性实现。COLSPAN="n"表示单元格跨n列，ROWSPAN="n"表示跨n行。例如： ``` <TABLE border="2"> <TR> <TD colspan="3">学生成绩表</TD> </TR> <TR> <TD>英语</TD> <TD>数学</TD> <TD>语文</TD> </TR> <TR> <TD>95</TD> <TD>98</TD> <TD>89</TD> </TR> </TABLE> ``` 在这个例子中，“学生成绩表”单元格跨了3列。通过熟练掌握这些基础知识，可以创建出各种复杂和美观的HTML表格，以满足网页设计和数据展示的需求。

domgtaoli

粉丝: 0
资源: 3

HTML表格基础与应用

北大青鸟html完整课件

北大青鸟html课件

北大青鸟Html课件

北大青鸟html课件第三章

北大青鸟6.0课件S2阶段项目

北大青鸟javascript课件

北大青鸟java课件

北大青鸟 php课件

北大青鸟S1课件

北大青鸟Java课件

最新资源