HTML 中的元標(biāo)記
Sep 04, 2024 pm 04:20 PM
HTML 中的元標(biāo)記用於定義有關(guān)網(wǎng)頁或 HTML 文件的資料。借助元標(biāo)記，可以定義文件的描述、上次更新時的作者資訊；它用於給出 HTML 文件的詳細(xì)屬性。元標(biāo)記在 中定義。 HTML 標(biāo)籤，包含在
中部分。對於網(wǎng)頁設(shè)計者來說，顯示網(wǎng)頁的實(shí)際顯示部分是最有用的。整個視窗控制將由他們使用 HTML 5 中的元標(biāo)記來完成。大多數(shù)瀏覽器都會引用元標(biāo)記來實(shí)現(xiàn)許多有用的功能，例如刷新頁面、顯示網(wǎng)頁內(nèi)容以及它們使用的 Web 服務(wù)。文法
head 部分使用的元標(biāo)記如下：
<meta charset="utf-8">
在上面的語法中，它指出 charset=”utf-8” 為顯示任何類型的語言提供了最佳支援。
這是另一個具有某些值的元標(biāo)記的語法是：
<meta name="viewport" content="width=device-width, initial-scale=1.0">
它用於處理視窗的大小及其所有頁面尺寸值和頁面滾動，以完美地適應(yīng)我們的網(wǎng)頁在任何類型的設(shè)備上。
HTML 中的元標(biāo)記清單
HTML 中使用了不同類型的 Meta 標(biāo)籤；我們來一一看看：
1。 這是一個非?；镜脑獦?biāo)記，用於定義任何類型的語言。
2。 ?用來定義最多 150 個字的內(nèi)容說明。
3。 ?用來保留所定義公司的所有版權(quán)。
4。 ?用來定義特定網(wǎng)頁的摘要。
5。 ?它用來定義 HTML 文件的作者。
6。 ?用於定義標(biāo)籤屬性中定義的特定公司的URL位址。
7。 ?它用於處理我們文件中的評級。
8。 ?如果我們想為 HTML 文件定義副標(biāo)題，那麼可以使用此標(biāo)籤。
9。 ?它用於在指定的時間刷新我們的網(wǎng)頁垃圾郵件。
10。 ?它是用來依照定義的實(shí)體值來分類我們的文件。
11。 ?這個標(biāo)籤用來指??定Meta標(biāo)籤中的一些關(guān)鍵字，這樣就可以在我們的文件中輕鬆搜尋這些內(nèi)容。
12。 ?此標(biāo)籤用於定義我們文件的摘要。
HTML 中元標(biāo)記的工作
HTML中的Meta標(biāo)籤主要用於在我們的網(wǎng)頁文件中包含機(jī)器可讀的信息，這些信息在網(wǎng)頁上實(shí)際上是不可見的。這個標(biāo)籤在 HTML 中的另一個最重要的工作是，借助這個標(biāo)籤，人們可以使用這個元標(biāo)籤功能輕鬆重定向到另一個網(wǎng)頁。
元標(biāo)記可以正常運(yùn)作的一些屬性清單如下：
1。內(nèi)容： 元標(biāo)記中的內(nèi)容就像其包含的元標(biāo)記的值一樣。
2。名稱： 名稱用作元標(biāo)記的屬性。它以詳細(xì)資訊、所有者、關(guān)鍵字等形式出現(xiàn)。
3。 http-equiv: 此屬性用於定義文件中的標(biāo)頭詳細(xì)資訊。
4。 Charset： 它是 Meta 標(biāo)籤中的主要屬性，用於定義字元編碼以在其文件中進(jìn)行聲明。
5。方案： 此屬性用於定義將使用實(shí)際元標(biāo)記的方案。但 HTML5 不支援這種類型的屬性。
HTML 中元標(biāo)記的範(fàn)例
讓我們來看一些例子
範(fàn)例#1
我們將使用Meta標(biāo)籤，它會被電腦系統(tǒng)讀取，但網(wǎng)頁的訪客看不到任何內(nèi)容。
HTML 程式碼：
<html> <head> <meta charset="UTF-8"> <meta name="description" content="Meta tag details information here"> <meta name="robots" content="Robotics"/> <meta name="hotmail:card" content="summary"/> </head> </html>
輸出：它將顯示空白螢?zāi)蛔鳛檩敵觥?
Example #2
Here is this example we are going to use different kinds of Meta tags and show the output; the web page will be refresh at every specific time and store cookies for your page, also mentioning its expiry date.
HTML code:
<html> <head> <title>Meta Tags Example</title> <meta name = "keywords" content = "HTML, Meta Tags, Metadata" /> <meta name = "description" content = "Learning about Meta Tags." /> <meta http-equiv = "cookie" content = "userid = xyz; expires = Tuesday, 31-Dec-19 23:59:59 IST;" /> <meta name = "revised" content = "EDUCBA -Online courses, 3/7/2019" /> <meta http-equiv = "refresh" content = "5" /> </head> <body> <h1>EDUCBA</h1> <h2>Become an Awesome Design Expert</h2> <p>EDUCBA- All about online certification courses</p> <h4>Learn Graphic designing, Animation, Game Development, Video Editing & more with our Online Certification Courses</h4> <p>Choose your interest area and get certified with our online Courses in Finance, Data Science, Software Development, Excel, Design, Project Management, Personal Development, Marketing and Human Resources.</p> </body> </html>
Output: The webpage shown in output will refresh every 5 seconds.
Example #3
Let’s see another example using meta tags, it will reflect the same as above, but after refreshing the webpage, it will redirect to another webpage which URL’s will be mentioned in the Meta tag as shown in the below HTML code:
HTML code:
<head> <title>Meta Tags in HTML 5</title> <meta name = "keywords" content = "HTML 5, Meta Tag" /> <meta name = "description" content = "Detail description of Meta Tags in HTML 5."/> <meta http-equiv = "refresh" content = "10; url = https://www.educba.com/" /> </head> <body> <p>EDUCBA- All about online certification courses</p> </body>
Output:
Conclusion
So, a Meta tag in Html is used to define metadata about HTML documents. The code included in it is a machine-readable format that works well with a webpage but doesn’t show any content on the page to the visitors. Meta tag containing 3 different types of attributes like global, element-specific, and event handler attributes.
以上是HTML 中的元標(biāo)記的詳細(xì)內(nèi)容。更多資訊請關(guān)注PHP中文網(wǎng)其他相關(guān)文章！
熱AI工具
Undress AI Tool
免費(fèi)脫衣圖片
Undresser.AI Undress
人工智慧驅(qū)動的應(yīng)用程序，用於創(chuàng)建逼真的裸體照片
AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。
Clothoff.io
AI脫衣器
Video Face Swap
使用我們完全免費(fèi)的人工智慧換臉工具，輕鬆在任何影片中換臉！
熱門文章
熱工具
記事本++7.3.1
好用且免費(fèi)的程式碼編輯器
SublimeText3漢化版
中文版，非常好用
禪工作室 13.0.1
強(qiáng)大的PHP整合開發(fā)環(huán)境
Dreamweaver CS6
視覺化網(wǎng)頁開發(fā)工具
SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)
熱門話題
構(gòu)建網(wǎng)頁的HTML元素是什麼？
Jul 03, 2025 am 02:34 AM
網(wǎng)頁結(jié)構(gòu)需核心HTML元素支撐，1.頁面整體結(jié)構(gòu)由、、構(gòu)成，其中為根元素，存放元信息，展示內(nèi)容；2.內(nèi)容組織依賴標(biāo)題（-）、段落（）及區(qū)塊標(biāo)籤（如、）以提升條理與SEO；3.導(dǎo)航通過與實(shí)現(xiàn)，常用組織鏈接並輔以aria-current屬性增強(qiáng)可訪問性；4.表單交互涉及、、與，確保用戶輸入與提交功能完整。正確使用這些元素能提升頁面清晰度、維護(hù)性及搜索引擎優(yōu)化。
使用HTML5服務(wù)器序列事件處理重新連接和錯誤。
Jul 03, 2025 am 02:28 AM
使用HTML5SSE時，處理重連和錯誤的方法包括：1.了解默認(rèn)重連機(jī)制，EventSource默認(rèn)在連接中斷後3秒重試，可通過retry字段自定義間隔；2.監(jiān)聽error事件以應(yīng)對連接失敗或解析錯誤，區(qū)分錯誤類型並執(zhí)行相應(yīng)邏輯，如網(wǎng)絡(luò)問題依賴自動重連、服務(wù)器錯誤手動延遲重連、認(rèn)證失效刷新token；3.主動控制重連邏輯，如手動關(guān)閉並重建連接、設(shè)置最大重試次數(shù)、結(jié)合navigator.onLine判斷網(wǎng)絡(luò)狀態(tài)以優(yōu)化重試策略。這些措施可提升應(yīng)用穩(wěn)定性與用戶體驗(yàn)。
為現(xiàn)代頁面宣布正確的HTML5 Doctype。
Jul 03, 2025 am 02:35 AM
Doctype是告訴瀏覽器用哪種HTML標(biāo)準(zhǔn)解析頁面的聲明，現(xiàn)代網(wǎng)頁只需在HTML文件最開頭寫。其作用是確保瀏覽器以標(biāo)準(zhǔn)模式而非怪異模式渲染頁面，且必須位於第一行，前面不能有空格或註釋；正確寫法僅有一種，不推薦使用舊版本或其他變體；其他如charset、viewport等應(yīng)放在部分。
使用HTML屬性實(shí)現(xiàn)客戶端表單驗(yàn)證。
Jul 03, 2025 am 02:31 AM
client-sideformvalidationCanbedOnewithOutJavaScriptbyusinghtmlattributes.1）useRequiredToEnforCemandatoryField.2）validateMailsAndUrllSwithTyPeatTributesLikeEmailOrurl，orusepatternwithRegegexforCustomAlorurl
如何使用HTML將選項(xiàng)分組？
Jul 04, 2025 am 03:16 AM
在HTML中使用標(biāo)籤可以對下拉菜單中的選項(xiàng)進(jìn)行分組。具體方法是用包裹一組元素，並通過label屬性定義組名，如：1.包含蘋果、香蕉、橙子等選項(xiàng)；2.包含胡蘿蔔、西蘭花等選項(xiàng)；3.每個為一個獨(dú)立分組，組內(nèi)選項(xiàng)自動縮進(jìn)。注意事項(xiàng)包括：①不支持嵌套；②可通過disabled屬性禁用整個組；③樣式受限需結(jié)合CSS或第三方庫美化；可使用Select2等插件增強(qiáng)功能。
使用HTML按鈕元素實(shí)現(xiàn)可點(diǎn)擊按鈕
Jul 07, 2025 am 02:31 AM
要使用HTML的button元素實(shí)現(xiàn)可點(diǎn)擊按鈕，首先需掌握其基本用法與常見註意事項(xiàng)。 1.使用標(biāo)籤創(chuàng)建按鈕，並通過type屬性定義行為（如button、submit、reset），默認(rèn)為submit；2.通過JavaScript添加交互功能，可內(nèi)聯(lián)寫法或通過ID綁定事件監(jiān)聽器以提升維護(hù)性；3.利用CSS自定義樣式，包括背景色、邊框、圓角及hover/active狀態(tài)效果，增強(qiáng)用戶體驗(yàn)；4.注意常見問題：確保未啟用disabled屬性、正確綁定JS事件、避免佈局遮擋，並藉助開發(fā)者工具排查異常。掌握這
使用HTML5地理位置API獲取用戶當(dāng)前位置。
Jul 02, 2025 pm 05:03 PM
使用HTML5GeolocationAPI獲取用戶位置時，必須先獲得用戶授權(quán)，且需在合適時機(jī)請求並說明用途；基本方法為navigator.geolocation.getCurrentPosition()，包含成功回調(diào)、錯誤回調(diào)和配置參數(shù)；常見失敗原因包括權(quán)限被拒、瀏覽器不支持、網(wǎng)絡(luò)問題等，應(yīng)提供替代方案和明確提示。具體建議如下：1.在用戶操作觸發(fā)時請求權(quán)限，如點(diǎn)擊按鈕；2.使用enableHighAccuracy、timeout、maximumAge等參數(shù)優(yōu)化定位效果；3.錯誤處理應(yīng)區(qū)分不同錯誤
用HTML5語義標(biāo)記和微數(shù)據(jù)改善SEO。
Jul 03, 2025 am 01:16 AM
使用HTML5語義標(biāo)籤和Microdata可提升SEO，因?yàn)樗鼛椭阉饕娓美斫忭撁娼Y(jié)構(gòu)與內(nèi)容含義。 1.使用HTML5語義標(biāo)籤如、、、、和來明確頁面區(qū)塊功能，有助於搜索引擎建立更準(zhǔn)確的頁面模型；2.添加Microdata結(jié)構(gòu)化數(shù)據(jù)標(biāo)註具體內(nèi)容，例如文章作者、發(fā)布日期、商品價格等，使搜索引擎能識別信息類型並用於富媒體摘要展示；3.注意正確使用標(biāo)籤避免混淆、避免重複標(biāo)記、測試結(jié)構(gòu)化數(shù)據(jù)有效性、定期更新以適應(yīng)schema.org的變化，並結(jié)合其他SEO手段長期優(yōu)化。
