Header

优质

小牛编辑

125浏览

2023-12-01

我们了解到典型的HTML文档将具有以下结构 -

Document declaration tag 
<html>
   <head>
      Document header related tags
   </head>
   <body>
      Document body related tags
   </body>
</html>

本章将提供有关标头部分的更多详细信息，该部分由HTML 标记表示。标记是各种重要标记的容器，如

，，，，，和标记。

HTML标签

HTML

标记用于指定HTML文档的标题。以下是给HTML文档标题的示例 -

<!DOCTYPE html>
<html>
   <head>
      <title>HTML Title Tag Example</title>
   </head>
   <body>
      <p>Hello, World!</p>
   </body>
</html>

HTML 标记

HTML 标记用于提供有关HTML文档的元数据，其中包括有关页面到期，页面作者，关键字列表，页面描述等的信息。

以下是HTML文档中标记的一些重要用法 -

<!DOCTYPE html>
<html>
   <head>
      <title>HTML Meta Tag Example</title>
      <!-- Provide list of keywords -->
      <meta name = "keywords" content = "C, C++, Java, PHP, Perl, Python">
      <!-- Provide description of the page -->
      <meta name = "description" content = "Simply Easy Learning by xnip">
      <!-- Author information -->
      <meta name = "author" content = "xnip">
      <!-- Page content type -->
      <meta http-equiv = "content-type" content = "text/html; charset = UTF-8">
      <!-- Page refreshing delay -->
      <meta http-equiv = "refresh" content = "30">
      <!-- Page expiry -->
      <meta http-equiv = "expires" content = "Wed, 21 June 2006 14:25:27 GMT">
      <!-- Tag to tell robots not to index the content of a page -->
      <meta name = "robots" content = "noindex, nofollow">
   </head>
   <body>
      <p>Hello, World!</p>
   </body>
</html>

HTML 标记

HTML 标记用于指定页面中所有相对URL的基本URL，这意味着在定位给定项目时，所有其他URL将连接到基本URL。

例如，在使用基本URL https://www.xnip.cn/目录为给定URL添加前缀后，将搜索所有给定的页面和图像 -

<!DOCTYPE html>
<html>
   <head>
      <title>HTML Base Tag Example</title>
      <base href = "https://www.xnip.cn/" />
   </head>
   <body>
      <img src = "/images/logo.png" alt = "Logo Image"/>
      <a href = "/html/index.htm" title = "HTML Tutorial"/>HTML Tutorial</a> 
   </body>
</html>

但是，如果您将基本URL更改为其他内容，例如，如果基本URL是https://www.xnip.cn/home，则图像和其他给定链接将变为类似https://www.xnip.cn/home/images /logo.png和https://www.xnip.cn/html/index.htm

HTML 标记

HTML 标记用于指定当前文档和外部资源之间的关系。以下示例链接Web根目录中css子目录中可用的外部样式表文件 -

<!DOCTYPE html>
<html>
   <head>
      <title>HTML link Tag Example</title>
      <base href = "https://www.xnip.cn/" />
      <link rel = "stylesheet" type = "text/css" href = "/css/style.css">
   </head>
   <body>
      <p>Hello, World!</p>
   </body>
</html>

HTML 标签

HTML 标记用于指定当前HTML文档的样式表。以下是在标记内定义几个样式表规则的示例 -

<!DOCTYPE html>
<html>
   <head>
      <title>HTML style Tag Example</title>
      <base href = "https://www.xnip.cn/" />
      <style type = "text/css">
         .myclass {
            background-color: #aaa;
            padding: 10px;
         }
      </style>
   </head>
   <body>
      <p class = "myclass">Hello, World!</p>
   </body>
</html>

Note - 要了解层叠样式表的工作原理，请查看css的单独教程

HTML 标签

HTML 标记用于包含外部脚本文件或定义HTML文档的内部脚本。以下是我们使用JavaScript定义简单JavaScript函数的示例 -

<!DOCTYPE html>
<html>
   <head>
      <title>HTML script Tag Example</title>
      <base href = "https://www.xnip.cn/" />
      <script type = "text/JavaScript">
         function Hello() {
            alert("Hello, World");
         }
      </script>
   </head>
   <body>
      <input type = "button" onclick = "Hello();" name = "ok" value = "OK"  />
   </body>
</html>

Note - 要了解JavaScript的工作原理，请查看 javascript 提供的单独教程