HTML 基础
HTML 高级教程
HTML5 特征
HTML5 示例
HTML5 参考手册

HTML 开始使用

HTML 文件只是一个以 .html 或 .htm 扩展名保存的文本文件。

开始

在本教程中,您将了解创建 HTML 文档或网页是多么容易。 要开始编写 HTML 代码,您只需要两个东西:一个简单的文本编辑器和一个网络浏览器。

好吧,让我们开始创建您的第一个 HTML 页面。

创建您的第一个 HTML 文档

让我们完成以下步骤。 在本教程结束时,您将制作一个 HTML 文件,在 Web 浏览器中显示"Hello world"消息。

第 1 步:创建 HTML 文件

打开您计算机的纯文本编辑器并创建一个新文件。

提示: 我们建议您使用记事本(在 Windows 上)、TextEdit(在 Mac 上)或其他一些简单的文本编辑器来执行此操作; 不要使用 Word 或写字板! 了解基本原理后,您可以切换到更高级的工具,例如 Adobe Dreamweaver。

第 2 步:输入一些 HTML 代码

从一个空窗口开始并输入以下代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <title>A simple HTML document</title>
</head>
<body>
    <p>Hello World!<p>
</body>
</html>

第 3 步:保存文件

现在在您的桌面上将文件保存为"myfirstpage.html"。

注意: 指定扩展名 .html 很重要 — 一些文本编辑器,例如记事本,会自动将其另存为 .txt

在浏览器中打开文件。 导航到您的文件,然后双击它。 它将在您的默认 Web 浏览器中打开。 如果没有,请打开浏览器并将文件拖到其中。

代码说明

你可能会想那段代码是关于什么的。 好吧,让我们找出答案。

  • 第一行 <!DOCTYPE html>文档类型声明。 它指示 Web 浏览器该文档是 HTML5 文档。 它不区分大小写。
  • <head> 元素是提供有关文档信息的标签的容器,例如,<title> 标签定义了文档的标题。
  • <body> 元素包含在 Web 浏览器中呈现并显示给用户的文档的实际内容(段落、链接、图像、表格等)。

您将在接下来的章节中详细了解不同的 HTML 元素。 现在,只关注 HTML 文档的基本结构。

注意: DOCTYPE 声明出现在网页顶部的所有其他元素之前; 但是 doctype 声明本身不是 HTML 标签。 每个 HTML 文档都需要一个文档类型声明,以确保您的页面正确显示。

提示: <html>, <head><body> 标签构成了每个网页的基本骨架。 <head></head> 中的内容对用户来说是不可见的,除了一个例外:<title></title> 标签之间的文本,它显示为浏览器选项卡上的标题。


HTML 标签和元素

HTML 以由标记标签组成的 HTML 元素的形式编写。 这些标记标签是 HTML 的基本特征。 每个标记标签都由一个关键字组成,用尖括号括起来,例如 <html>, <head>, <body>, <title>, <p> 等。

HTML 标签通常成对出现,如 <html></html>。 一对中的第一个标签通常称为开始标签(或开始标签),第二个标签称为结束标签(或结束标签)。

一个开始标签和一个结束标签是相同的,除了结束标签的开始尖括号后的斜线(/),告诉浏览器命令已经完成。

在开始和结束标签之间,您可以放置适当的内容。 例如,由 p 元素表示的段落可以写成:

<p>这是一个段落。</p>
<!-- 带有嵌套元素的段落 -->
<p>
    This is <b>another</b> paragraph.
</p>

您将在下一章了解各种 HTML 元素

Advertisements