网页设计与制作

张泉 老师

目录

  • 1 《网页设计与制作》概要
    • 1.1 课程标准
    • 1.2 课程考核方案
    • 1.3 课程任务汇总
  • 2 项目一  HTML语言
    • 2.1 网站和网页
    • 2.2 网站策划书
    • 2.3 HTML标识语言1--标签格式
    • 2.4 HTML标识语言2--属性和标题
    • 2.5 HTML标识语言3-段落排版和图片
    • 2.6 HTML标识语言4--链接和表格
    • 2.7 HTML标识语言5--样式和css
    • 2.8 HTML标识制作页面-简单排版
    • 2.9 HTML标识制作页面-链接及多页面
    • 2.10 HTML复习题
  • 3 项目二 DM软件制作页面和站点
    • 3.1 Dreamweaver  工作流程和工作区
    • 3.2 Dreamweaver  工作区2 --工具栏
    • 3.3 Dreamweaver  站点
    • 3.4 Dreamweaver  创建页面
    • 3.5 Dreamweaver  管理资源库
    • 3.6 Dreamweaver  CSS样式
    • 3.7 Dreamweaver  表格
HTML标识语言1--标签格式

 学习任务1.3 .Html语言标识 

1、.Html语言标识基本语法

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

  • HTML 标签是由尖括号包围的关键词，比如 <html>

  • HTML 标签通常是成对出现的，比如 <b> 和 </b>

  • 标签对中的第一个标签是开始标签，第二个标签是结束标签

  • 开始和结束标签也被称为开放标签和闭合标签


2、HTML 文档 = 网页

  • HTML 文档描述网页

  • HTML 文档包含 HTML 标签和纯文本

  • HTML 文档也被称为网页

Web 浏览器的作用是读取 HTML 文档，并以网页的形式显示出它们。浏览器不会显示 HTML 标签，而是使用标签来解释页面的内容：

<html>
<body>

<h1>我的第一个标题</h1>

<p>我的第一个段落。</p>

</body>
</html>

例子解释

  • <html> 与 </html> 之间的文本描述网页

  • <body> 与 </body> 之间的文本是可见的页面内容

  • <h1> 与 </h1> 之间的文本被显示为标题

  • <p> 与 </p> 之间的文本被显示为段落



3、使用 Notepad 或 TextEdit 来编写 HTML

可以使用专业的 HTML 编辑器来编辑 HTML：

  • Adobe Dreamweaver

  • Microsoft Expression Web

  • CoffeeCup HTML Editor

不过，我们同时推荐使用文本编辑器来学习 HTML，比如 Notepad (PC) 或 TextEdit (Mac)。我们相信，使用一款简单的文本编辑器是学习 HTML 的好方法。

通过记事本，依照以下四步来创建您的第一张网页。

步骤一：启动记事本

如何启动记事本：

开始
    所有程序
        附件
            记事本

步骤二：用记事本来编辑 HTML

在记事本中键入 HTML 代码：


记事本

步骤三：保存 HTML

在记事本的文件菜单选择“另存为”。

当您保存 HTML 文件时，既可以使用 .htm 也可以使用 .html 扩展名。两者没有区别，完全根据您的喜好。

在一个容易记忆的文件夹中保存这个文件，比如 w3school。

步骤四：在浏览器中运行这个 HTML 文件

启动您的浏览器，然后选择“文件”菜单的“打开文件”命令，或者直接在文件夹中双击您的 HTML 文件。

结果应该类似这样：

在浏览器中查看