1.3 HTML文档入门（课件）-高一《网页设计与制作（Dreamweaver CC》同步精品课堂（电工版2021）

2023-06-14
| 18页
| 420人阅读
| 3人下载
精品

内容正文：

网页设计与制作（Dreamweaver CC） 第三版 HTML文档入门 网页设计基础 HTML文档入门 1.3 学习任务描述： 通过在记事本和Dreamweaver中使用HTML代码制作网页，介绍HTML代码的常用标记，以及使用HTML代码制作简单网页的方法。 1、HTML概述 HTML（Hypertext Markup Language,超文本标记语言）是用于创建web文档的一种标记语言。自1990年首次用于网页编辑后，由于其编写制作的简易性，HTML迅速成为网页编程的主流语言，几乎所有网页都是由HTML或其他语言程序嵌套在HTML中编写而成的。 HTML文档入门 1.3 而IE浏览器中打开任意一个网页，选择“查看——源文件”命令，系统会启动记事本程序，打开该网页的源程序。 HTML文档入门 1.3 图1-16所示文本其实就是HTML源代码，可以使用任意文字编辑器编写，将其保存为htm或html格式即可。要制作HTML文档，一般有两种方法：一是使记事本之类的工具；二是使用可视化的网页制作工具，根据用户操作自动生成HTML代码， Dreamweaver、FrontPage 等软件。 HTML文档入门 1.3 2、HTML文档基本结构 一个HTML文档是由一系列网页元素和标记组成的，HTML用标记规定元素的属性和它在文件中的位置。HTML文档的结构包括头部分(head)和主体部分(body)两大部分，头部分描述浏览器所需的信息，主体部分包含要说明的具体内容。 HTML文档入门 1.3 HTML文档入门 1.3 （1）HTML文档包括三个标记：文档标记<html>......</html>，头部标记<head>......</head>和主体标记<body>......</body>。 （2）标记不区分大小写。 （3）所有的标记都用尖括号<>括起来。 <html>标记放在HTML文档的最前面，用来标识HTML文档的开始；而</html>标记恰恰相反，它放在HTML文档的最后面，用来标识HTML文档的结束。这两个标记必须成对使用。 注意事项 HTML文档入门 1.3 在<head>......</head>内的内容称为文件头部，可以包含<title>......</title>、<meta>等标记，这部分信息不会在浏览器的窗口中显示出来。 在<body>......</body>内的内容称为正文主体，可以包含<p>......</p>、<img>、<hr>、<table>等标记，其内容将在浏览器窗口中显示出来。 注意事项 HTML文档入门 1.3 3、HTML文档常用标记 HTML文档入门 1.3 （1）标题标记 格式：<title>网页标题</title> 说明：该标记在<head>......</head>标记中。包含的文字将出现在浏览器的标题栏上。当用户将此页面添加到收藏夹时，也会默认以该标题为名称进行收藏。 3、HTML文档常用标记 HTML文档入门 1.3 （2）主体标记 格式：<body bgcolor>"页面背景颜色" background=背景图像" text="文本颜色"> 主体内容 </body> 说明：该标记包括所有主体内容，可以设置页面的背景颜色、背景图像、文本颜色等属 。背景颜色和文本颜色可以使用颜色名（如蓝色blue）或颜色代码值（如蓝色#0000FF）。 3、HTML文档常用标记 HTML文档入门 1.3 (3)文字标记 格式：<font size="文字大小" face="字体" color="文本颜色">文本内容</font> 说明：<font>标记用于设置页面中文字的字号、字体、颜色等属性。设置字号时，<font size=1 >表示最小，<font size=7>表示最大，<font size=+l>表示比预设字大一级，<font srze=-l>表示比预设字小一级 3、HTML文档常用标记 HTML文档入门 1.3 (4)段落标记 格式：<p align："对齐方式">段落文本</p> 说明：由<p>标记标识的文字代表同一个段落的文字： align属性有left、center和right 三个参数，分别代表左对齐、居中对齐和右对齐。 3、HTML文档常用标记 HTML文档入门 1.3 (5)换行标记 格式：<br> 说明：<br>是一个单标记，如果在HTML文档中的任何位置使用<br>标记，则当文档显示在浏览器中时，该位置之后的文字显示在下一行。 3、HTML文档常用标记 HTML文档入门 1.3 (6)水平线标记 格式：<hr align”对齐方式”color=”颜色”width=”宽度”size=”高度”noshade>。 说明：在页面中插入一条水平分隔线，将不同

资源预览图

1.3 HTML文档入门（课件）-高一《网页设计与制作（Dreamweaver CC》同步精品课堂（电工版2021）
1
1.3 HTML文档入门（课件）-高一《网页设计与制作（Dreamweaver CC》同步精品课堂（电工版2021）
2
1.3 HTML文档入门（课件）-高一《网页设计与制作（Dreamweaver CC》同步精品课堂（电工版2021）
3
1.3 HTML文档入门（课件）-高一《网页设计与制作（Dreamweaver CC》同步精品课堂（电工版2021）
4
1.3 HTML文档入门（课件）-高一《网页设计与制作（Dreamweaver CC》同步精品课堂（电工版2021）
5
1.3 HTML文档入门（课件）-高一《网页设计与制作（Dreamweaver CC》同步精品课堂（电工版2021）
6
所属专辑
由于学科网是一个信息分享及获取的平台，不确保部分用户上传资料的 来源及知识产权归属。如您发现相关资料侵犯您的合法权益，请联系学科网，我们核实后将及时进行处理。