内容正文:
组建网站跟我做
信息科技七年级第四单元第20课
人教版(2024)第四单元 《校园活动线上展》
Theme template
04
01
05
新知学习—表格标签
02
新知学习——网站的特点
目录
新知学习—用超链接组织网站中的网页
03
小试牛刀——谁是主页?
06
实践活动1—表格标签运用
08
实践活动3—网站文本超链接
07
实践活动2—网站图像超链接?
展示网站—局域网自建服务器
知识回顾——网站与网页
网页是一个包含HTML标签的纯文本文件,它可以存放在世界某个角落的某一台计算机中,是万维网中的一"页"。
思考:网站与网页的区别是什么?二者之间的关系是什么?
网页
网站
网站是由一组相互关联的网络资源(如网页、多媒体内容)组成的集合,这些资源通过一个共同的域名标识,并发布在至少一个网络服务器上 。
网页是构成网站的基本元素。一个完整的网站,通常包括主页和与之相连的其他网页
3
新知学习——网站的特点
通常包含一个首页作为入口,通过超链接(连接其他子页面)
结构性
可通过浏览器公开访问,所有公开网站共同构成万维网
可访问性
用途广泛,包括个人博客、企业宣传、政府服务、电子商务等
功能多样性
4
小试牛刀——谁是主页?
思考:在四张网页截图中请辨别出主页及主页的子网页,阐述你的划分 依据?
主页
子网页
子网页
子网页
5
小试牛刀——谁是主页?
网站中通过
设置超链接
把网页关联
起来
是 HTML 中的一个特殊字符实体,表示“不间断空格”
6
新知学习—用超链接组织网站中的网页
网页中的超链接对象可以是文字、图像、按钮、视频等。
请说出科技科网站中从主页到子网页及子网页到主网页所使用的链接对象?
主页→子网页:图像超链接
子网页→主页:文本超链接
7
新知学习—图像超链接
类型 代码
使用图像作为链接
在这种情况下,<a> 元素包围着 <img> 元素 <a href=’链接地址’><img src=’图像位置’></a>
<a href='page2.html'><img src="images/3D.jpg"></a>
链接到的网页文件名
图像的位置
是 HTML 中的一个特殊字符实体,表示“不间断空格”
8
新知学习—表格标签
❉HTML 表格由 <table> 标签来定义。
✽每个表格均有若干行(由 <tr> 标签定义),每行被分割为若干单元格(由 <td> 标签定义),表格可以包含标题行(<th>)用于定义列的标题。
<html>
<table border="1">
<tr>
<td>单元格1</td>
<td>单元格2</td>
</tr>
<tr>
<td>单元格3</td>
<td>单元格4</td>
</tr>
</table>
</html>
左侧代码可以绘制出什么样的表格?
9
实践活动1—表格标签运用
<html>
<table border="1">
<tr>
<td>单元格1</td>
<td>单元格2</td>
</tr>
<tr>
<td>单元格3</td>
<td>单元格4</td>
</tr>
</table>
</html>
任务要求:使用HBuliderX打开“实践活动1——表格标签.html”,修改 代码,构造3行4列的表格,具体表格呈现内容如图所示,保 存修改后的代码
10
实践活动2—网站图像超链接
实现功能:
1、点击机器狗图片打开page1.html网页
2、点击风力发电图片打开page3.html网页
任务要求:使用HBuliderX打开“学生作业-待完善”文件夹中的“index.html”,补全代码缺失部分①②
11
知识回顾—文本超链接
类型 代码
使用文本作为链接 <a href=’链接地址’>显示文本</a>
12
实践活动3—网站文本超链接
任务要求:使用HBuliderX打开“学生作业-待完善”文件夹中的“page2.html和page3.html文件”,补全代码缺失部分①
实现功能:
1、在3D打印网页通过点击“主页”文件返回网站主页
2、在风力发电网页通过点击“主页”文件返回网站主页
13
展示网站—局域网自建服务器
01
02
选择一台计算机担当服务器
将制作的网页、涉及的图像等资料,汇总保存到名为Web的文件夹中
把Web文件夹移动到服务器软件所在的文件夹中,运行该软件,并记录服务器的IP地址和端口
03
14
展示网站—局域网自建服务器
15
拓展延伸—网站发布要知道
个人网站发布在互联网的相关法律法规
《未成年人网络保护条例》
第三十一条 网络服务提供者为未成年人提供信息发布、即时通讯等服务的,应当依法要求未成年人或者其监护人提供未成年人真实身份信息。未成年人或者其监护人不提供未成年人真实身份信息的,网络服务提供者不得为未成年人提供相关服务。
16
谢谢!!!
变化是常态,一路向前,知识无界
Lavf58.46.101
$$