首頁 > web前端 > html教學 > HTML 中的元標記

HTML 中的元標記

WBOY
發布: 2024-09-04 16:20:50
原創
548 人瀏覽過

HTML 中的元標記用於定義有關網頁或 HTML 文件的資料。借助元標記,可以定義文件的描述、上次更新時的作者資訊;它用於給出 HTML 文件的詳細屬性。元標記在 中定義。 HTML 標籤,包含在

中部分。對於網頁設計者來說,顯示網頁的實際顯示部分是最有用的。整個視窗控制將由他們使用 HTML 5 中的元標記來完成。大多數瀏覽器都會引用元標記來實現許多有用的功能,例如刷新頁面、顯示網頁內容以及它們使用的 Web 服務。

文法

head 部分使用的元標記如下:

<meta charset="utf-8">
登入後複製

在上面的語法中,它指出 charset=”utf-8” 為顯示任何類型的語言提供了最佳支援。
這是另一個具有某些值的元標記的語法是:

<meta name="viewport" content="width=device-width, initial-scale=1.0">
登入後複製

它用於處理視窗的大小及其所有頁面尺寸值和頁面滾動,以完美地適應我們的網頁在任何類型的設備上。

HTML 中的元標記清單

HTML 中使用了不同類型的 Meta 標籤;我們來一一看看:

1。 這是一個非常基本的元標記,用於定義任何類型的語言。

2。  用來定義最多 150 個字的內容說明。

3。  用來保留所定義公司的所有版權。

4。  用來定義特定網頁的摘要。

5。  它用來定義 HTML 文件的作者。

6。  用於定義標籤屬性中定義的特定公司的URL位址。

7。  它用於處理我們文件中的評級。

8。  如果我們想為 HTML 文件定義副標題,那麼可以使用此標籤。

9。  它用於在指定的時間刷新我們的網頁垃圾郵件。

10。  它是用來依照定義的實體值來分類我們的文件。

11。  這個標籤用來指​​定Meta標籤中的一些關鍵字,這樣就可以在我們的文件中輕鬆搜尋這些內容。

12。  此標籤用於定義我們文件的摘要。

HTML 中元標記的工作

HTML中的Meta標籤主要用於在我們的網頁文件中包含機器可讀的信息,這些信息在網頁上實際上是不可見的。這個標籤在 HTML 中的另一個最重要的工作是,借助這個標籤,人們可以使用這個元標籤功能輕鬆重定向到另一個網頁。

元標記可以正常運作的一些屬性清單如下:

1。內容: 元標記中的內容就像其包含的元標記的值一樣。

2。名稱: 名稱用作元標記的屬性。它以詳細資訊、所有者、關鍵字等形式出現。

3。 http-equiv: 此屬性用於定義文件中的標頭詳細資訊。

4。 Charset: 它是 Meta 標籤中的主要屬性,用於定義字元編碼以在其文件中進行聲明。

5。方案: 此屬性用於定義將使用實際元標記的方案。但 HTML5 不支援這種類型的屬性。

HTML 中元標記的範例

讓我們來看一些例子

範例#1

我們將使用Meta標籤,它會被電腦系統讀取,但網頁的訪客看不到任何內容。

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>
登入後複製

輸出:它將顯示空白螢幕作為輸出。

HTML 中的元標記

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.

HTML 中的元標記

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:

HTML 中的元標記

HTML 中的元標記

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 中的元標記的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板