大阳城集团app下载

書名： HTML5+CSS3+JavaScript 從入門到項目實踐（超值版）
作者名：聚慕課教育研發中心
本章字數： 664字
更新時間： 2020-06-29 17:37:18

2.4 HTML 5文檔頭部標簽

<head>標簽是文檔的頭部標簽，它是所有頭部元素的容器。<head>中的元素可以引用腳本、指示瀏覽器在哪里找到樣式表、提供元信息等。

文檔的頭部描述了文檔的各種屬性和信息，包括文檔的標題、在Web中的位置及和其他文檔的關系等。絕大多數文檔頭部包含的數據都不會真正作為內容顯示給讀者。<title>定義文檔的標題，它是<head>標簽中唯一必需的元素。

應該把<head>標簽放在文檔的開始處，緊跟在<html>后面，并處于<body>標簽之前，如下面基本的HTML結構代碼如下：

      <!DOCTYPE html>
      <html>
      <!--頭部標簽-->
      <head>
         <meta charset="UTF-8">
         <title>Title</title>
      </head>
      <body>
      </body>
      </html>

2.4.1 設置頁面標題標簽

<title>標簽定義文檔的標題，在所有HTML文檔中是必需的，只能出現在<head>中。

<title>元素的作用：

● 定義瀏覽器工具欄中的標題。

● 提供頁面被添加到收藏夾時的標題。

● 顯示在搜索引擎結果中的頁面標題。

【例2-2】（實例文件：ch02\Chap2.2.html）頁面標題標簽。

      <!DOCTYPE html>
      <html>
      <head>
         <meta charset="UTF-8">
         <title>第一個頁面</title>
      </head>
      <body>
      </body>
      </html>

相關的代碼實例請參考Chap2.2.html文件，在IE瀏覽器中運行的結果如圖2-5所示。

圖2-5 頁面標題標簽

2.4.2 引用外部文件標簽

【例2-3】（實例文件：ch02\Chap2.3.html）引用外部文件標簽。

      <!DOCTYPE html>
      <html>
      <head>
         <meta charset="UTF-8">
         <title></title>
      </head>
      <body>
      <p>引入外部文件標簽</p>
      </body>
      </html>

相關的代碼實例請參考Chap2.3.html文件，在IE瀏覽器中運行的結果如圖2-6所示。

圖2-6 頁面加載效果

在上面的案例中引入style樣式文件，style樣式文件代碼如下：

      p{
          background: red;
          color: white;
      }

在<head>標簽中使用<link>把style樣式引入HTML，代碼如下：

      <head>
            <meta charset="UTF-8">
            <title></title>
      <!--引入外部css文件-->
            <link rel="stylesheet" href="style.css">
      </head>

在IE瀏覽器中運行的結果如圖2-7所示。

圖2-7 引用外部文件標簽

2.4.3 內嵌樣式標簽

【例2-4】（實例文件：ch02\Chap2.1.html）內嵌樣式標簽。

相關的代碼實例請參考Chap2.4.html文件，在IE瀏覽器中運行的結果如圖2-8所示。

圖2-8 內嵌樣式標簽

官术网_书友最值得收藏!

HTML5+CSS3+JavaScript 從入門到項目實踐（超值版）

2.4 HTML 5文檔頭部標簽

2.4.1 設置頁面標題標簽

2.4.2 引用外部文件標簽

2.4.3 內嵌樣式標簽