整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
作網頁時，經常需要設置網頁的基本信息，如網頁的標題、作者等。為此，HTML提供了一系列設置網頁信息的標簽，這些標簽通常都寫在
<head>標簽內，也被稱為HTML.文檔頭部相關標簽。下面將介紹常用的HTML文檔頭部標簽中的<title>和<meta>標簽。
(1)<title>標簽
<title>標簽用于設置HTML頁面的標題，也就是為網頁取一個名稱。在網頁結構中，<title>標簽必須位于<head>標簽內。一個HTML.文檔只能含有一個<title>標簽，<title></title>標簽之間的內容將顯示在瀏覽器窗口的標題欄中。例如，將某個頁面標題設置為“輕松學習HTML.5”，示例代碼如下：
<title>輕松學習HIML.5</title>上述代碼對應的頁面效果如下圖：
(2)<meta>標簽
<meta>標簽用于定義頁面的元信息(元信息不會顯示在最終的頁面效果中)，可重復出現在標簽中。在HTML中,<meta>標簽是一個單標簽，本身不包含任何內容，僅表示網頁的相關信息。通過標簽的屬性，可以定義頁面的相關參數。
例如，為搜索引擎提供網頁的關鍵字、作者姓名、內容描述，以及定義網頁的刷新時間等。下面介紹<meta/>標簽常用的幾組設置，具體如下。
<meta name-”名稱”content-”值”>：在<meta>標簽中使用 name 屬性和 content 屬性可以為搜索引擎提供信息。其中，name屬性提供搜索內容名稱，content屬性提供對應的搜索內容值，這些屬性的具體應用如下。
設置網頁關鍵字，如某圖像網站的關鍵字設置，示例代碼如下：
<meta name=“keywoxds”content=“千圖網，免費素材下載，千圖網免費素材圖庫，矢量圖，矢量圖庫，圖像素材，網頁素材，
免費素材，PS素材，網站素材，設計模板，設計素材，網頁模板免費下載，千圖，素材中國，素材，免費設計，圖像”/>在上述示例代碼中，nare屬性的屬性值為"keywonds”，該屬性值用于定義搜索內容名稱為網頁關鍵字;content 屬性的屬性值用于定義關鍵字的具體內容，多個關鍵字內容之間可以用“，”分隔。
設置網頁描述，如某圖像網站的描述信息設置，示例代碼如下：
<meta name=”description”content=”專注免費設計素材下裁的網站！提供矢量圖素材，矢量青景圖像，矢量圖庫，還有
psd素材，PS素材，設計模板，設計素材，PPT素材，以及網頁素材，網站素材，網頁圖標免費下載”/>在上述示例代碼中，name屬性的屬性值為“deseription”，該屬性值用于定義搜索內容名稱為網頁描述;comtent 屬性的屬性值用于定義描述的具體內容。網頁描述的文字不必過多，能夠描述清晰即可。
設置網頁作者，如可以為網站增加作者信息，示例代碼如下：
<meta name-"author" content="網絡部"/>在上述示例代碼中，name屬性的屬性值為”author”，該屬性值用于定義搜索內容名稱為網頁作者;content屬性的屬性值用于定義具體的作者信息。
<meta http-equiv=”名稱”content=”值”>在<meta/>標簽中，http-equiv 屬性和content 屬性可以設置服務器發送給瀏覽器的HTTP頭部信息，為瀏覽器顯示該頁面提供相關的參數標準。其中，http-equiv屬性提供參數類型，content屬性提供對應的參數值，這些屬性的具體應用如下。設置字符集，如某圖像官網字符集的設置，示例代碼如下：
<meta http-equiva"Content-Type" content="text/html; charset=gbk"/>在上述示例代碼中，hitp-epuiv屬性的屬性值為“Content-Type”.content屬性的屬性值為“test/html”和“charset=gbk”，兩個屬性值之間用“：”隔開。其中，“text/html”用于說明當前文檔類型為HIML“charset=gbk”用于說明文檔字符集為GBK(中文編碼)。
目前最常用的國際化字符集編碼格式是UTF-8，常用的中文字符集編碼格式主要是GBK和GB2312。當用戶使用的字符集編碼格式與當前瀏覽器不匹配時，網頁內容就會出現亂碼。新版本的HTML.5簡化了字符集的寫法，示例代碼如下：
<meta charset="utf-g">設置頁面自動刷新與跳轉，如定義某個頁面10秒后跳轉至百度首頁，示例代碼如下：
<meta http-equiv""refresh" content="10; url- httpa://sww.baidu.com/"/>在上述示例代碼中，http-equiv屬性的屬性值為“refresh”，content屬性的屬性值為數值和URL。兩個屬性值之間用“：”隔開，分別用于指定跳轉時間和目標頁面的URL。跳轉時間默認以秒為單位。
管現代Web開發更加依賴于各種MVC框架，但是開發者仍然需要對HTML和DOM有基本的了解。然而，即使對有多年經驗的前端開發人員來說，也會遇到一些不知道的情況。
HTML<head>元素用作元數據（關于數據的數據）的容器。它用在<html>標簽和<body>標簽之間。
HTML文檔的頭部內容在頁面加載時不會顯示在瀏覽器中。它僅包含有關HTML文檔的元數據。
元數據定義HTML文檔的標題，字符集，樣式，鏈接，腳本和其他元信息。
HTML頭部可以包含很多元數據信息，也可以很少或沒有信息，這取決于我們的需求。但是頭部對HTML文檔至關重要。
<head>元素包含了所有的頭部標簽元素。在<head>元素中你可以插入腳本（scripts）,樣式文件（CSS），及各種meta信息。
可以添加在頭部區域的元素標簽為:<title>,<style>,<meta>,<link>,<script>,<noscript>和<base>。
HTML<title>元素用于定義文檔的標題。它在所有HTML/XHTML文檔中使用。<title>元素必須放在<head>元素之間，并且一個文檔只能有一個title元素。
它定義了瀏覽器選項卡中的標題。
當用戶將頁面添加到收藏夾時，它為頁面提供標題。
它在搜索引擎結果中顯示頁面的標題。
示例代碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>文檔標題</title>
</head>
<body>文檔內容......</body>
</html>12345678復制代碼類型：[html]HTML<base>元素
<base>標簽描述了基本的鏈接地址/鏈接目標，該標簽作為HTML文檔中所有的鏈接標簽的默認鏈接:
<head>
<base href="http://www.runoon.com/images/" target="_blank">
</head>123復制代碼類型：[html]HTML<link>元素
HTML<link>元素用于將外部樣式表鏈接到您的網頁。<link>元素包含兩個主要屬性，即“rel”和“href”。rel屬性表示它是一個樣式表，href給出該外部文件的路徑。
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>123復制代碼類型：[html]HTML<style>元素
HTML<style>元素用于為HTML頁面設置樣式。<style>元素只影響當前頁面HTML頁面的CSS屬性。如果要對多個頁面應用CSS，則應使用單獨的CSS文件。
<head>
<style type="text/css">body {background-color:yellow} p {color:blue}</style>
</head>123復制代碼類型：[html]HTML<meta>元素
HTML<meta>元素用于指定網頁上的字符集，頁面描述，關鍵字，作者和其他元數據。
搜索引擎和其他Web服務使用元數據來更好地對網頁進行排名。
<meta>標簽提供的元數據不顯示在頁面上，但會被瀏覽器解析。
<meta>一般放置于<head>區域。
<meta>標簽定義字符集：
<meta charset="UTF-8"> 1復制代碼類型：[html]charset屬性指定字符編碼。在此示例中，我們將其設置為“UTF-8”，這意味著它可以顯示任何語言。
<meta>標簽定義搜索引擎關鍵詞:
<meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript">1復制代碼類型：[html]<meta>標簽定義網頁描述內容:
<meta name="description" content="免費 Web & 編程 教程">1復制代碼類型：[html]<meta>標簽定義網頁作者:
<meta name="author" content="Runoon">1復制代碼類型：[html]<meta>標簽定義每30秒鐘刷新頁面:
<meta http-equiv="refresh" content="30">1復制代碼類型：[html]元刷新用于向瀏覽器提供指令，以在給定的時間間隔后自動刷新頁面。如上例所示，它將在30秒后自動刷新。
<meta http-equiv="refresh" content="10; url=https://www.javatpoint.com/html>1復制代碼類型：[html]如果添加了URL，則在指定時間結束后重定向到該頁面。
<meta>標簽定義設備尺寸
HTML5中引入了此方法，以通過使用<meta>標簽來控制視窗大小。視窗是用戶在網頁上的可見區域。它隨設備的不同而變化，在手機上的顯示尺寸明顯小于計算機屏幕。
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 1復制代碼類型：[html]<meta>視窗元素如何設定和控制頁面的尺寸和縮放比例。
width=device-width是用來設置頁面的寬度將與設備的屏幕寬度保持一致。
當最初由瀏覽器加載頁面時，initial-scale=1.0用于設置初始縮放級別。
HTML<script>元素
<script>標簽用于加載腳本文件，如：JavaScript。
<script>元素在以后的章節中會詳細描述。
HTMLhead元素
標簽 | 描述 |
<head> | 定義了文檔的信息 |
<title> | 定義了文檔的標題 |
<base> | 定義了頁面鏈接標簽的默認鏈接地址 |
<link> | 定義了一個文檔和外部資源之間的關系 |
<meta> | 定義了HTML文檔中的元數據 |
<script> | 定義了客戶端的腳本文件 |
<style> | 定義了HTML文檔的樣式文件 |
「鏈接」
以為頭部區域填加的元素標簽有<title><style><meta><link><script><noscript><base>
定義HTML文檔的標題
<base>定義了所有鏈接的URL
<title>元素
定義不同文檔的標題
在HTML中，是必須填寫
定義了瀏覽器工具欄的標題，
當網頁添加收藏夾時，顯示在收藏夾中的標題
顯示搜索引擎結果頁面的標題
<link>元素
標簽定義了文檔與外部資源之間的關系
標簽通常用于鏈接到樣式表
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
<base>
標簽描述了基本的鏈接地址/鏈接目標，該標簽作為HTML文檔中所有鏈接標簽的默認鏈接
<head>
<base target="_blank">
</head>
<style>
標簽定義了HTML文檔樣式文件引用地址
也可以直接添加樣式渲染HTML文檔
<meta>
描述一些基本的元數據
提供了元數據；元數據也不顯示在頁面上，但會被瀏覽器解析
META元素通常用于指定網頁的描述、關鍵詞、文檔的最后修改時間，作者和其它元數據
元數據可以使用于瀏覽器（如何顯示內容或重新加載頁面），搜索引擎（關鍵詞），或其它web服務；
<meta>一般放置于<head>區域
HTML<script>元素
用于加載腳本文件，如JAVASCRIPT
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
