中文版Dreamweaver网页制作案例教程[2021版]项目三网页中的文本、图像与音视频.pptxVIP

中文版Dreamweaver网页制作案例教程

目录contents项目一网页设计与制作基础知识项目二网站规划与站点创建项目三网页中的文本、图像与音视频项目四网页中的列表与超链接项目五网页中的表格与表单项目六网页布局项目七行为、模板与库项目八实战案例——制作爱学精品课网站

项目三网页中的文本、图像与音视频在网页中添加文本在网页中添加图像任务一任务二在网页中添加音视频任务三

文本、图像与音视频是网页中常见的元素。文本用于传递网页中的信息。图像与音视频用于丰富网页内容，美化网页的显示效果，增强网页的可读性，提升用户的体验感。本项目将介绍网页中文本、图像与音视频的相关知识，以及使用Dreamweaver2021在网页中添加这些元素并设置样式的方法。项目导读

知识目标技能目标思政目标掌握在网页中添加文本、图像与音视频的方法。掌握用于标记文本、图像与音视频的标签。掌握文本样式与图像样式的设置方法。能够使用Dreamweaver2021在网页中添加文本与特殊字符，并设置文本样式。能够使用Dreamweaver2021在网页中添加图像，并设置图像样式。能够使用Dreamweaver2021在网页中添加音视频文件。通过在网页中添加文本、图像及音视频，明白各种事物都有其独特的作用。通过制作丰富的案例，提升实操能力。学习目标

在网页中添加文本1PART01任务描述任务准备任务实施——制作“科技学院”主页的“通知公告”模块一、添加文本二、添加特殊字符三、设置文本样式

文本是网页中最常见的元素，优秀的网页文本设计不仅可以传递信息，还具有良好的视觉效果。本任务首先介绍在网页中添加文本与特殊字符的方法，然后介绍文本样式的设置方法，最后通过制作“科技学院”主页的“通知公告”模块，使学生练习使用Dreamweaver2021在网页中添加文本并设置文本样式的操作。任务描述

任务准备一、添加文本二、添加特殊字符三、设置文本样式

全班学生以3～5人为一组，各组选出小组长，小组长组织组内成员扫码观看视频“网页文本的设计要点”，讨论并回答以下问题。任务准备问题1：网页文本的设计要点有哪些？问题2：任选一种类型的网站，简述如何设计网页中的文本。网页文本的设计要点

一、添加文本文本标题段落特殊格式文本

使用Dreamweaver2021的“插入”面板可以在网页中添加标题，具体操作方法是，首先确定添加标题的位置；然后在“插入”面板中单击“标题”下拉按钮，在展开的下拉列表中选择具体的标题标签（如“H6”）；最后输入标题内容，如图所示。此时，“标题”按钮自动变为对应的标题标签按钮（如“标题∶H6”），单击该按钮会插入对应的标题标签（如h6）。一、添加文本1. 添加标题

HTML5提供了6个标题标签h1～h6，分别用于标记不同级别的标题。其中，h1标签标记的标题级别最高，h6标签标记的标题级别最低。默认情况下，这些标签标记的标题都具有字体加粗效果，并随着标题级别的降低，字体大小依次减小，如图所示。一、添加文本1. 添加标题

在一些网页中，标题就相当于网页内容的大纲，根据网页内容合理安排标题可以更清晰地表达出网页的整体内容。小贴士一、添加文本1．添加标题

使用Dreamweaver2021的“插入”面板可以在网页中添加段落，具体操作方法是，首先确定添加段落的位置；然后在“插入”面板中单击“段落”按钮；最后输入段落内容。一、添加文本2. 添加段落

在HTML5中，使用p标签标记段落。段落通常是指正文形式的文本，其内容较多时会在网页中以多行显示。一、添加文本2. 添加段落

在网页中，具有特殊格式的文本是指以粗体、斜体或下画线等效果显示的文本。使用Dreamweaver2021的“属性”面板可以在网页中添加具有特殊格式的文本，具体操作方法是，首先确定添加文本的位置；然后选择“窗口”/“属性”选项，打开“属性”面板；接着单击“粗体”按钮，添加以粗体显示的文本，按“F5”键后单击“斜体”按钮，添加以斜体显示的文本，如图所示。一、添加文本3. 添加具有特殊格式的文本

在HTML5中，使用strong标签标记的文本以粗体显示，使用em标签标记的文本以斜体显示。此外，HTML5还提供了许多文本格式化标签来标记不同的文本，可直接在代码视图中输入相关代码进行添加。一、添加文本3. 添加具有特殊格式的文本

（1）sup标签与sub标签，分别用于标记上标文本与下标文本。上标文本的位置比主体文本稍高，常见的上标文本有指数、商标符号等；下标文本的位置比主体文本稍低，常见的下标文本有脚注、化学符号脚标等。（2）ins标签与del标签，分别用于标记插入的文本与删除的文本。默认