關於HTML頭部的詳細介紹-html教學-PHP中文網

首頁

web前端

html教學

關於HTML頭部的詳細介紹

高洛峰

Mar 22, 2017 pm 02:13 PM

HTML 元素

元素包含了所有的頭部標籤元素。在元素中你可以插入腳本（scripts）, 樣式文件（CSS），及各種meta資訊。

可以加入頭部區域的元素標籤為:

, <style>, <meta>, <link>, <script>, <noscript>, and <base>.<hr/><h2 style="font-size: 22px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif; margin-top: 10px; margin-bottom: 10px; font-weight: bold; background-color: transparent; color: rgb(0, 0, 0);"># HTML <title> 元素<p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"># <title> 標籤定義了不同文件的標題。 <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"> <title> 在 HTML/XHTML 文件中是必須的。 <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"> <title> 元素:<ul style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;" class=" list-paddingleft-2"><li><p># 定義了瀏覽器工具列的標題<li><p><br/><li><p># 當網頁加入到收藏夾時，顯示在收藏夾中的標題<li><p><br/><li><p># 顯示在搜尋引擎結果頁面的標題<li><p><br/><p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"># 一個簡單的 HTML 文件:<p style="font-size: 13px; font-family: 'courier new';"> <!DOCTYPE html><br/> <html><br/> <head><br/> <title>Title of the document</style> </title> <br> <br><br># <br> The content of the document......<br> <br><br># <hr> <h2 style="font-size: 22px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif; margin-top: 10px; margin-bottom: 10px; font-weight: bold; background-color: transparent; color: rgb(0, 0, 0);"># HTML <base> 元素</h2> <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"># <base> 標籤描述了基本的連結位址/連結目標，該標籤作為HTML文件中所有的連結標籤的預設連結:</p> <p style="font-size: 13px; font-family: 'courier new';"># </p> <br> <base href="http://www.52bcx.com/images/" target="_blank"> <br> <hr> <h2 style="font-size: 22px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif; margin-top: 10px; margin-bottom: 10px; font-weight: bold; background-color: transparent; color: rgb(0, 0, 0);"># HTML <link> 元素</h2> <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"># <link> 標籤定義了文件與外部資源之間的關係。 </p> <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"> <link> 標籤通常用於連結到樣式表:</p> <p style="font-size: 13px; font-family: 'courier new';"> </p> <br> <link rel="stylesheet" type="text/css" href="mystyle.css"> <br> <hr> <h2 style="font-size: 22px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif; margin-top: 10px; margin-bottom: 10px; font-weight: bold; background-color: transparent; color: rgb(0, 0, 0);"> HTML <style> 元素</style> </h2> <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"># <style> 標籤定義了HTML文件的樣式文件引用位址.</style></p> <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"> 在<style> 元素中你需要指定樣式檔來渲染HTML文件:</style></p> <p style="font-size: 13px; font-family: 'courier new';"> </p> <br> <style type="text/css"><br/> body {background-color:yellow}<br/> p {color:blue}<br/> </style> <br> <hr> <h2 style="font-size: 22px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif; margin-top: 10px; margin-bottom: 10px; font-weight: bold; background-color: transparent; color: rgb(0, 0, 0);"># HTML <meta> 元素</h2> <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"># meta標籤描述了一些基本的元資料。 </p> <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"> <meta> 標籤提供了元資料.元資料也不顯示在頁面上，但會被瀏覽器解析。 </p> <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"> META元素通常用於指定網頁的描述，關鍵字，文件的最後修改時間，作者，和其他元資料。 </p> <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"> 元資料可以使用瀏覽器（如何顯示內容或重新載入頁面），搜尋引擎（關鍵字），或其他Web服務。 </p> <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"> <meta>一般放置於 </p>區域<h2 style="font-size: 22px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif; margin-top: 10px; margin-bottom: 10px; font-weight: bold; background-color: transparent; color: rgb(0, 0, 0);"># <meta> 標籤- 使用實例</h2> <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"> 為搜尋引擎定義關鍵字:</p> <p style="font-size: 13px; font-family: 'courier new';"> <meta name="keywords" content="HTML, CSS, XML, XHTML, JavaScript"></p> <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"> 為網頁定義描述內容:</p> <p style="font-size: 13px; font-family: 'courier new';"> <meta name="description" content="Free Web tutorials on HTML and CSS"></p> <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"> 定義網頁作者:</p> <p style="font-size: 13px; font-family: 'courier new';"> <meta name="author" content="Hege Refsnes"></p> <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"> 每30秒刷新目前頁面:</p> <p style="font-size: 13px; font-family: 'courier new';"># <meta http-equiv="refresh" content="30"></p> <hr> <h2 style="font-size: 22px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif; margin-top: 10px; margin-bottom: 10px; font-weight: bold; background-color: transparent; color: rgb(0, 0, 0);"># HTML <script> 元素</script> </h2> <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"># <script>標籤用於載入腳本文件，如： JavaScript。 </script></p> <p style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif;"> <script> 元素在以下章節會詳細描述。 </script></p> <hr> <h2 style="font-size: 22px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif; margin-top: 10px; margin-bottom: 10px; font-weight: bold; background-color: transparent; color: rgb(0, 0, 0);"> HTML head 元素</h2> <table class="reference" style="font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif; border-collapse: collapse; width: 722px;"><tbody> <tr style="background-color: rgb(246, 244, 240);" class="firstRow"> <th align="left" style="font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif; color: rgb(255, 255, 255); background-color: rgb(85, 85, 85); border: 1px solid rgb(85, 85, 85); padding: 3px; vertical-align: top; text-align: left;" width="20%"> 標籤</th> <th align="left" style="font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif; color: rgb(255, 255, 255); background-color: rgb(85, 85, 85); border: 1px solid rgb(85, 85, 85); padding: 3px; vertical-align: top; text-align: left;" width="80%"> 描述</th> </tr> <tr style="background-color: rgb(255, 255, 255);"> <td style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif; border: 1px solid rgb(212, 212, 212); padding: 7px 5px; vertical-align: top;"># </td> <td style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif; border: 1px solid rgb(212, 212, 212); padding: 7px 5px; vertical-align: top;"> 定義了文檔的資訊</td> </tr> <tr style="background-color: rgb(246, 244, 240);"> <td style="line-height: 16px; font-size: 12px; font-family: 'Microsoft Yahei', 'Helvetica Neue', Helvetica, Arial, sans-serif; border: 1px solid rgb(212, 212, 212); padding: 7px 5px; vertical-align: top;"># <title> 定義了文檔的標題 # 定義了頁面連結標籤的預設連結位址 # 定義了一個文檔和外部資源之間的關係 # 定義了HTML文件中的元資料 # <script></script> 定義了客戶端的腳本檔案定義了HTML文件的樣式檔

以上是關於HTML頭部的詳細介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章！

陳述

本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn

公眾號網頁更新緩存難題：如何避免版本更新後舊緩存影響用戶體驗？Mar 04, 2025 pm 12:32 PM

公眾號網頁更新緩存，這玩意兒，說簡單也簡單，說複雜也夠你喝一壺的。你辛辛苦苦更新了公眾號文章，結果用戶打開還是老版本，這滋味，誰受得了？這篇文章，咱就來扒一扒這背後的彎彎繞繞，以及如何優雅地解決這個問題。讀完之後，你就能輕鬆應對各種緩存難題，讓你的用戶始終體驗到最新鮮的內容。先說點基礎的。網頁緩存，說白了就是瀏覽器或者服務器為了提高訪問速度，把一些靜態資源（比如圖片、CSS、JS）或者頁面內容存儲起來。下次訪問時，直接從緩存裡取，不用再重新下載，速度自然快。但這玩意兒，也是個雙刃劍。新版本上線，