head標籤中有什麼屬性？-html教學-PHP中文網

首頁

web前端

html教學

head標籤中有什麼屬性？

不言

Mar 21, 2019 am 11:29 AM

htmlhtml5javascript

這篇文章帶給大家的內容是關於head標籤中有什麼屬性？有一定的參考價值，有需要的朋友可以參考一下，希望對你有幫助。

head 標籤裡有什麼？

每一個HTML 文件中，都有一個不可或缺的標籤：

，它作為一個容器，主要包含了用於描述HTML 文件自身資訊（元資料）的標籤，這些標籤一般不會在頁面中被顯示出來，大多情況下是給瀏覽器和搜尋引擎看的。

可用在

裡面的標籤有： , <base> , <link> , < ); ,> noscript> 。 元資訊標籤介紹 <title> 定義文件的標題，顯示在瀏覽器的標題列或標籤頁上，一般會完整地概括整個網頁的內容。 <base> 給頁面上所有相對 URL 的提供一個基礎。一份文件中只能有一個 <base> 標籤。 目前我只觀察到「淘寶網」使用了這個標籤。 <link> 規定外部資源與目前文件的關係，常於連結樣式表，如下： <pre class="brush:php;toolbar:false"><link></pre> 當然還有很多其他的作用： <ol><li>例如用於SEO，主要給搜尋引擎看的：</li></ol> <pre class="brush:php;toolbar:false"><link></pre> 在網站中常有多個url 指向同一個頁面的情況，上述標籤告知搜尋引擎頁面的主url 是什麼，以便搜尋引擎保留主要頁面而去除其他重複頁面。 <ol><li>提供 rss 訂閱的：</li></ol> <pre class="brush:php;toolbar:false"><link></pre> 上述標籤除搜尋引擎可以看懂以外，也能被許多瀏覽器外掛程式辨識。 <ol><li>表示頁面 icon 的：</li></ol> <pre class="brush:php;toolbar:false"><link></pre> 多數瀏覽器會讀取這個 link 的資源並展示在頁面上。 <ol><li>對頁面提供預處理的：</li></ol> <pre class="brush:php;toolbar:false"><link></pre> 提前對一個網域做 dns 查詢。強制對域名進行預讀取在有的情況下很有用,。 例如, 在網站的主頁上，強制在整個網站上對頻繁引用的網域做預解析處理，即使它們不在主頁本身上使用。雖然主頁的效能可能不受影響，但是會提高網站整體效能。 <style></style> 包含文件的樣式資訊。 <meta> 一種通用的元資料資訊表示標籤，一般以鍵值對出現，如：<meta name="xxx" content="yyy"> charset 屬性 <pre class="brush:php;toolbar:false"><meta></pre> 從HTML5 開始，上述寫法被建議使用，用於宣告目前文件所使用的字元編碼，建議放在 中的第一位。 http-equiv屬性 <pre class="brush:php;toolbar:false"><meta></pre> 在 HTML4 中，上述程式碼用於宣告字元集，但現在已不被推薦。 除了content-type ，還有其他幾個值： content-language （過時）、set-cookie （過時）、default-style 、refresh 、content-security- policy 因為不常用，所以就不一一介紹了，也蠻容易理解，有興趣點這裡了解。 name 屬性 其實 <meta> 標籤可以被自由定義，只要讀取和寫入的雙方約定好 name 和 content 的格式就可以了。來看一個例子： <pre class="brush:php;toolbar:false"><meta></pre> 上面這種用法並不在 HTML 標準中，但卻是行動裝置開發的事實標準。這裡來解釋 content 中的內容： width ：頁面寬度，可以是一個正整數；也可以一個字串 "device-width" ，表示跟裝置寬度相等。 height ：頁面高度，可以是一個正整數；也可以一個字串 "device-height" ，表示跟裝置高度相等。 initial-scale ：初始縮放比例。 minimum-scale ：最小縮放比例。 maximum-scale ：最大縮放比例。 user-scalable ：是否允許使用者縮放。 name 屬性的值除了可以是 viewport 之外，還有相當多的值： application-name 、author 、description 、generator 、keywords 、referrer 、robots 等。 同樣的，就不一一介紹了，有興趣可以點選這裡了解。 <script></script> 用於嵌入或引用可執行腳本。來看看幾個 script 標籤常見的全域屬性： async 讓瀏覽器使用另一個執行緒下載腳本，這時不會阻塞頁面渲染。當腳本下載完成後，瀏覽器會暫停渲染，執行腳本，執行完畢後繼續渲染頁面。 async 無法保證腳本的執行順序，哪個腳本先下載結束就會先執行。 defer 同樣會使瀏覽器並行下載腳本，但下載完畢不會立即執行，而是會等到 DOM 載入完成後（也就是剛讀完標籤）再執行腳本。 defer 可以保證腳本的執行順序就是它們在頁面上出現的順序。 src 定義引用外部腳本的位址，指定此屬性的 script 標籤內不應再有嵌入的腳本。如果腳本檔案使用了非英語字符，也應該註明字符的編碼。如： <script charset="utf-8" src="https://www.example.com/script.js"></script> type #預設值是text/javascript 想了解更多關於 <script> 標籤的詳細內容可以點擊這裡。 </script> <noscript></noscript> 如果頁面上的腳本類型不受支援或目前在瀏覽器中關閉了腳本，則在此中定義腳本未被執行時的替代內容。 總結 本文到這裡就結束了，其實關於link 和meta 標籤還有很多沒有介紹到，很多相關標籤都是有特殊的需求，只有在特定情況下才會使用，例如行動端開發就會用許多在PC 上並不需要的標籤。 當然平常使用也主要是看需求，就拿我目前來說，只是些許用到過一些與 viewport 和 SEO 相關的標籤。 鑑於此我推薦一個不錯的學習方法，就是去各大網站查看它們的 head 標籤裡都有什麼，遇到沒見過的就去搜索一下，熟悉起來會很快。 我這邊看過的網站有：「淘寶網」、「阿里巴巴」、「京東」、「網易嚴選」、「起點中文網」等。 這篇文章到這裡就已經全部結束了，更多其他精彩內容可以關注PHP中文網的<a href="http://www.php.cn/course/list/11.html" target="_blank">HTML教學影片</a>專欄！ #

以上是head標籤中有什麼屬性？的詳細內容。更多資訊請關注PHP中文網其他相關文章！

陳述

本文轉載於：segmentfault。如有侵權，請聯絡admin@php.cn刪除

從文本到網站：HTML的力量Apr 13, 2025 am 12:07 AM

HTML是一種用於構建網頁的語言，通過標籤和屬性定義網頁結構和內容。 1）HTML通過標籤組織文檔結構，如、。 2）瀏覽器解析HTML構建DOM並渲染網頁。 3）HTML5的新特性如、、增強了多媒體功能。 4）常見錯誤包括標籤未閉合和屬性值未加引號。 5）優化建議包括使用語義化標籤和減少文件大小。

了解HTML，CSS和JavaScript：初學者指南Apr 12, 2025 am 12:02 AM

WebDevelovermentReliesonHtml，CSS和JavaScript：1）HTMLStructuresContent，2）CSSStyleSIT和3）JavaScriptAddSstractivity，形成thebasisofmodernWebemodernWebExexperiences。

HTML的角色：構建Web內容Apr 11, 2025 am 12:12 AM

HTML的作用是通過標籤和屬性定義網頁的結構和內容。 1.HTML通過到、等標籤組織內容，使其易於閱讀和理解。 2.使用語義化標籤如、等增強可訪問性和SEO。 3.優化HTML代碼可以提高網頁加載速度和用戶體驗。

HTML和代碼：仔細觀察術語Apr 10, 2025 am 09:28 AM

htmlisaspecifictypefodyfocusedonstructuringwebcontent，而“代碼” badlyLyCludEslanguagesLikeLikejavascriptandPytyPythonForFunctionality.1）htmldefineswebpagertuctureduseTags.2）“代碼”代碼“ code” code code code codeSpassSesseseseseseseseAwiderRangeLangeLangeforLageforLogageforLogicIctInterract

HTML，CSS和JavaScript：Web開發人員的基本工具Apr 09, 2025 am 12:12 AM

HTML、CSS和JavaScript是Web開發的三大支柱。 1.HTML定義網頁結構，使用標籤如、等。 2.CSS控製網頁樣式，使用選擇器和屬性如color、font-size等。 3.JavaScript實現動態效果和交互，通過事件監聽和DOM操作。

HTML，CSS和JavaScript的角色：核心職責Apr 08, 2025 pm 07:05 PM

HTML定義網頁結構，CSS負責樣式和佈局，JavaScript賦予動態交互。三者在網頁開發中各司其職，共同構建豐富多彩的網站。

HTML容易為初學者學習嗎？Apr 07, 2025 am 12:11 AM

HTML適合初學者學習，因為它簡單易學且能快速看到成果。 1)HTML的學習曲線平緩，易於上手。 2)只需掌握基本標籤即可開始創建網頁。 3)靈活性高，可與CSS和JavaScript結合使用。 4)豐富的學習資源和現代工具支持學習過程。

HTML中起始標籤的示例是什麼？Apr 06, 2025 am 12:04 AM

AnexampleOfAstartingTaginHtmlis，beginSaparagraph.startingTagSareEssentialInhtmlastheyInitiateEllements，defiteTheeTheErtypes，andarecrucialforsstructuringwebpages wepages webpages andConstructingthedom。

See all articles