HTML入门教程：打造初学者必备基础 - CSDN文库

需积分: 0 151 浏览量更新于2024-07-21 收藏 639KB DOC 举报

HTML入门教程是专为初学者设计的，旨在介绍超文本标记语言（HTML）的基本概念和语法结构。HTML是一种用于创建网页的标准标记语言，它的核心在于利用一系列预定义的标签来指示文本的布局、样式以及内容的交互方式。在这个教程中，我们将深入探讨以下几个关键知识点： 1. **HTML的基本构成**： HTML文件由文本内容和标记组成。文本内容通常是我们看到的实际文本，而标记（或称为标签）如`<html>`、`<head>`、`<title>`、`<body>`和`<b>`等，用于控制文本的呈现形式。例如，`<html>`标签定义了整个文档的结构，`<title>`定义了网页的标题，`<body>`则包含了网页的主要内容。 2. **文件结构与标签**： - `<html>`标签是文档的根元素，标志着HTML文件的开始，`</html>`标签则表示文件的结束。 - `<head>`部分包含非可见的元数据，如页面标题、字符编码、CSS链接等，但不会显示在浏览器窗口中。 - `<title>`标签是网页的标题，用户在浏览器标签页上能看到。 - `<body>`标签内的内容会被浏览器显示在用户的屏幕上，`<b>`标签用于设置粗体文本。 3. **元素与标签的使用**： - HTML元素是通过标签来标识的，每个标签都有其特定的含义。例如，`<p>`（paragraph）表示段落，`<a>`（anchor）用于创建超链接。 - 标签通常成对出现，如`<b>`和`</b>`，起始标签（Opening Tag）先于结束标签（Closing Tag）。 - HTML标签不区分大小写，但为了代码可读性，通常推荐使用小写字母。 4. **文本处理**： HTML允许通过各种标签改变文本的样式，如加粗、斜体、颜色、字体等。初学者要学会如何使用这些标签来增强内容的表达效果。 5. **文件的创建与浏览**：初学者可以通过文本编辑器（如Notepad）创建HTML文件，并将其保存为`.html`或`.htm`扩展名。要查看文件，可以直接双击文件或在浏览器中通过"文件"菜单打开并选择该文件。理解这些基础概念是HTML学习的第一步，后续可能还会涉及CSS（层叠样式表）和JavaScript等用于美化和交互功能的语言。随着实践的积累，你将能逐渐掌握HTML的复杂度，并构建出功能丰富的网页。

</p>

</body>

</html>

name 属性

使用 name 属性，可以跳转到一个文件的指定部位。

使用 name 属性，要设置一对。一是设定 name 的名称，二是设定一个 href 指向这个

name：

<a href="#C1">参见第一章</a>

<a name="C1">第一章</a>

实例：

<html>

<body>

<p>

<a href="#C9">参见第六章</a>

</p><p>

<a name="C1"><h2>第 1 章</h2></a>

<p>这是站长网站长学院 admin5.com/html- 网页教程与代码的中文站点。</p>

<a name="C2"><h2>第 2 章</h2></a>

<p>这是站长网站长学院 admin5.com/html- 网页教程与代码的中文站点。</p>

<a name="C3"><h2>第 3 章</h2></a>

<p>这是站长网站长学院 admin5.com/html- 网页教程与代码的中文站点。</p>

<a name="C4"><h2>第 4 章</h2></a>

<p>这是站长网站长学院 admin5.com/html- 网页教程与代码的中文站点。</p>

<a name="C5"><h2>第 5 章</h2></a>

<p>这是站长网站长学院 admin5.com/html- 网页教程与代码的中文站点。</p>

<a name="C6"><h2>第 6 章</h2></a>

<p>这是站长网站长学院 admin5.com/html- 网页教程与代码的中文站点。</p>

<a name="C7"><h2>第 7 章</h2></a>

<p>这是站长网站长学院 admin5.com/html- 网页教程与代码的中文站点。</p>

<a name="C8"><h2>第 8 章</h2></a>

<p>这是站长网站长学院 admin5.com/html- 网页教程与代码的中文站点。</p>

<a name="C9"><h2>第 9 章</h2></a>

<p>这是站长网站长学院 admin5.com/html- 网页教程与代码的中文站点。</p>

</body>

</html>

name 属性通常用于创建一个大文件的章节目录(table of contents)。每个章节都建立一

个链接，放在文件的开始处，每个章节的开头都设置 Name 属性。当用户点击某个章节的

链接时，这个章节的内容就显示在最上面。

如果浏览器不能找到 Name 指定的部分，则显示文章开头，不报错

链接到 email 地址

如何表示上级目录

../表示源文件所在目录的上一级目录，../../表示源文件所在目录的上上级目录，以此类推。

假设 info.html 路径是：c:\Inetpub\wwwroot\sites\blabla\info.html

假设 index.html 路径是：c:\Inetpub\wwwroot\sites\index.html

在 info.html 加入 index.html 超链接的代码应该这样写：

<a href = "../index.html">index.html</a>

假设 info.html 路径是：c:\Inetpub\wwwroot\sites\blabla\info.html

假设 index.html 路径是：c:\Inetpub\wwwroot\index.html

在 info.html 加入 index.html 超链接的代码应该这样写：

<a href = "../../index.html">index.html</a>

假设 info.html 路径是：c:\Inetpub\wwwroot\sites\blabla\info.html

假设 index.html 路径是：c:\Inetpub\wwwroot\sites\wowstory\index.html

在 info.html 加入 index.html 超链接的代码应该这样写：

<a href = "../wowstory/index.html">index.html</a>

#

如何表示下级目录

引用下级目录的文件，直接写下级目录文件的路径即可。

假设 info.html 路径是：c:\Inetpub\wwwroot\sites\blabla\info.html

假设 index.html 路径是：c:\Inetpub\wwwroot\sites\blabla\html\index.html

在 info.html 加入 index.html 超链接的代码应该这样写：

<a href = "html/index.html">index.html</a>

假设 info.html 路径是：c:\Inetpub\wwwroot\sites\blabla\info.html

假设 index.html 路径是：c:\Inetpub\wwwroot\sites\blabla\html\tutorials\

index.html

在 info.html 加入 index.html 超链接的代码应该这样写：

<a href = "html/tutorials/index.html">index.html</a>

HTML 绝对路径(Absolute Path)

HTML 绝对路径(absolute path)指带域名的文件的完整路径。

假设你注册了域名 www.admin5.com/html，并申请了虚拟主机，你的虚拟主机提供商

会给你一个目录，比如 www，这个 www 就是你网站的根目录。

假设你在 www 根目录下放了一个文件 index.html，这个文件的绝对路径就是：

http://www.admin5.com/html。

假设你在 www 根目录下建了一个目录叫 html_tutorials，然后在该目录下放了一个文件

index.html，这个文件的绝对路径就是 http://www.admin5.com/html/

html_tutorials/index.html。

七、如何在 HTML 中创建表格

HTML 表格用<table>表示。一个表格可以分成很多行(row)，用<tr>表示；每行又可以

分成很多单元格(cell)，用<td>表示。

这三个 Tag 是创建表格最常用的 Tag。

示例

<html>

剩余51页未读，继续阅读

兜兜一圈

粉丝: 2
资源: 5

最新资源