HTML语言基础与网页制作详解

版权申诉

80 浏览量更新于2024-06-27 收藏 501KB PPTX 举报

"Dreamweaver网页设计的第二部分，讲解HTML语言的基本概念和常用标记符，通过实例介绍如何创建HTML网页。" 在网页设计领域，HTML（超文本标记语言）是构建网页的基础，它是一种标记语言而非编程语言，用于描述网页的结构和内容。HTML文件由一系列元素（标记符）组成，这些元素告诉浏览器如何呈现网页。了解和掌握HTML对于任何网页设计师来说都至关重要，因为它允许设计师不受特定平台限制地创建网页。 HTML网页的基本组成部分包括： 1. **文档声明（Document Type Declaration）**: 如`<!DOCTYPE>`，它告诉浏览器正在使用的HTML版本。在例子中，`<!example2-1.htm>`是一个简化的声明，实际应使用如`<!DOCTYPE html>`的标准声明。 2. **HTML标签**: `<html>`是整个文档的根元素，包含其他所有元素。 3. **头部（Head）**: `<head>`标签内的元数据定义了网页的标题和其他非可视信息，如字符编码（`<meta>`标签）和页面标题（`<title>`标签）。在例子中，`<meta http-equiv="Content-Type" content="text/html; charset=gb2312">`设置了文档类型为HTML和字符编码为GBK。 4. **主体（Body）**: `<body>`标签内包含网页的可见内容，如文本、图像、链接等。在例子中，`<body bgcolor="#FFFFFF" text="#000000">`设置了背景颜色和文字颜色。 5. **段落（Paragraphs）**: `<p>`标签用于定义段落，可以设置对齐方式（`align`属性）和字体大小（`<font>`标签的`size`属性）及颜色（`color`属性）。 6. **标题（Heading）**: HTML提供了六级标题标签`<h1>`到`<h6>`，例子中没有直接使用，但可以用于设置诗歌的标题。 7. **样式控制**: 虽然例子中使用了`align`、`size`和`color`等旧式HTML属性来控制样式，现代网页设计更倾向于使用CSS（层叠样式表）来实现更为复杂的布局和样式。学习HTML不仅可以帮助你直接编辑和理解网页源代码，还能在使用动态网页技术如ASP、JSP、PHP时更好地嵌入和控制HTML输出。例如，当你需要在PHP页面中动态生成内容时，理解HTML结构能使你更有效地编写代码。 Dreamweaver、Frontpage等集成开发环境（IDE）为HTML编辑提供了便利，它们具有所见即所得的界面，使得初学者也能快速上手。然而，理解HTML的基本语法和结构仍然是必要的，因为这有助于调试和优化网页，确保在不同浏览器和设备上的兼容性。通过实践创建简单的HTML网页，如例子中的杜牧诗《秋夕》，你可以逐步掌握HTML的基本元素和结构。这个过程不仅可以帮助你记忆标记符，还能让你了解HTML文件是如何被浏览器解析并显示出来的。随着技能的提升，你还可以学习更高级的HTML5特性，如语义化标签、媒体元素和表单控件，从而创建功能更丰富的交互式网页。

二

、

文

本

及

版

面

风

格

控

制

标

记

（一）文本控制

1、文本格式标记

文本控制主要是控制文本的字体、字体大小和颜色，这通过<font>标记来实现。

格式：

功能：设置网页中普通文字的显示效果。

属性：

(1)Face属性用于指定文字字体，如“楷体_GB2312”、“宋体”、“黑体”等。但要注意，

浏览器显示的字体与客户端安装的字体有关，如果网页文件中设置了客户端滑安装

的字体，则以默认的宋体字显示。因此，在使用字体时，应尽量使用一般操作系统

都会安装的宋休、黑体、楷体等。

(2)color属性用于设置字体的颜色。在HTML中颜色通常用#RRGGBB来表达，RR、

GG、BB分别代表红色、绿色、和蓝色的分量值，用十六进制数表示，取值范围为

00～FF。通过改变三基色的混合量，即可形成各种各样的颜色。另外，颜色也可以

用英文单词来表示。下面是常用颜色的取值及英文单词表。

颜色红色绿色蓝色黄色黑色白色紫色浅蓝色

取值 #FF0000 #00FF00 #0000FF #FFFF00 #000000 #FFFFFF #FF00FF #00FFFF

单词 Red Green Blue Yellow Black White Purple Aqua

剩余45页未读，继续阅读

猫一样的女子245

粉丝: 230
资源: 2万+

HTML语言基础与网页制作详解

"基于HTML和Dreamweaver的网页设计技巧.pptx

"信息发布与网页设计-Dreamweaver-11CSS.pptx详解

"学习如何在网页中使用行为PPT教案.pptx

Dreamweaver网页设计8.pptx

第5章Dreamweaver网页设计软件.pptx

Dreamweaver网页设计.pptx

第03章 Dreamweaver CS3网页设计基础.pptx

Dreamweaver制作动态网页.pptx

信息发布与网页设计-Dreamweaver-11CSS.pptx

DreamweaverCS4网页设计.pptx

最新资源