HTML入门：超文本标记语言基础教程 - CSDN文库

需积分: 9 54 浏览量更新于2024-07-21 1 收藏 489KB DOC 举报

HTML入门教程旨在帮助初学者轻松理解这一基础网页制作语言。HTML，全称为“超文本标记语言”，是一种用于创建网页的标准标记语言。它允许用户通过文本编辑器，如Notepad，来编写包含文本内容和特定标记的文件，这些标记指示浏览器如何呈现页面。 HTML文件通常以.htm或.html为扩展名。在示例中，我们看到了一个简单的HTML结构，包括<html>, <head>, <title>, <body>, 和 <b>等标签。让我们一一解析： 1. `<html>`标签：这是HTML文档的根元素，标志着HTML文件的开始和结束，即`<html>`和`</html>`。 2. `<head>`与`</head>`：这部分内容不直接在网页上显示，但包含了诸如元信息（metadata）和网页标题等重要元素。例如，`<title>`标签用于定义浏览器顶部的标题栏显示的标题。 3. `<title>`与`</title>`：这部分定义了网页的标题，对于SEO（搜索引擎优化）至关重要，因为它帮助搜索引擎识别页面主题。 4. `<body>`与`</body>`：这部分是网页的实际内容，用户在浏览器中可见。所有要在页面上展示的文本、图像、链接等都应放置在这两个标签之间。 5. `<b>`与`</b>`：这是一个表示加粗文本的标签，用于强调或突出显示文本。在示例中，“Thistextisbold”这段文本就被设置成了粗体。 HTML元素（HTMLElements）是构成网页的基本组件，它们通过标签来定义其功能和外观。每个元素由起始标签（Opening Tag）和结束标签（Closing Tag）组成，如`<p>`和`</p>`代表一个段落。虽然HTML标签通常是大小写不敏感的，但为了代码的可读性，建议遵循一定的命名规范，如标签名首字母大写，如`<Body>`。 HTML元素包括各种类型，如结构元素（定义页面布局）、文本格式化元素（如加粗、斜体）、链接元素（`<a>`）、图像元素（`<img>`）等。通过组合使用这些元素，你可以创建出丰富多彩、功能齐全的网页。学习HTML是进入Web开发的第一步，掌握了HTML，你就能构建静态网页，并为进一步学习CSS（层叠样式表）和JavaScript打下坚实的基础，从而实现网页的美化和动态交互。无论是个人项目，还是专业开发，HTML都是必备的技能之一。随着技术的发展，HTML5已经引入了许多新的元素和功能，使得网页开发更加便捷高效，也更利于移动设备的浏览体验。因此，不断更新和提升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页未读，继续阅读

tiananma0607

粉丝: 21
资源: 7

最新资源