起始標籤 | 結束標籤 |
---|---|
需要 | 不需要 |
<meta /> 有幾個屬性
屬性 | 值 | Deprecated or Obsolete |
---|---|---|
name | application-name author description generator keywords | |
content | 提供給 name 及 http-equiv 的內容 | |
scheme | 提供更多的資訊 | Obsolete |
http-equiv | content-style refres |
主要有兩方面的運用,分別使用 name 與 http-equiv 兩個屬性 (attribute) 。 name 搭配另一個屬性 content 使用,例如作者、描述、關鍵字等,如下表
屬性 | 值 | 功能 |
---|---|---|
name | author | 作者資訊 |
name | copyright | 版權資訊 |
name | description | 文件描述 |
name | keywords | 關鍵字資訊 |
搭配 name 的 content 可以是任意值,例如
< meta name = 'description' content = '線上免費學習程式語言的資源' /> < meta name = 'author' content = 'Kaiching Chang' /> < meta name = 'keywords' content = 'C' /> < meta name = 'keywords' content = 'C++' /> < meta name = 'keywords' content = 'Java' /> < meta name = 'keywords' content = 'JavaScript' /> < meta name = 'keywords' content = 'Python' /> < meta name = 'keywords' content = 'HTML 4.01' /> < meta name = 'keywords' content = '教學' /> |
以上是本站所使用的 <meta /> 標籤。
http-equiv 有兩種主要功能,其一為網頁自動更新,搭配 content 屬性中需要指定連結網址,如下例
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | < html > < head > < title >網頁標題</ title > < meta http-equiv = 'refresh' content = '5; URL=example06.html' /> </ head > < body > 這是 example05.html ,五秒後網頁會自動更新到 example06.html 。 </ body > </ html > <!-- 《程式語言教學誌》的範例程式 檔名:example05.html 功能:示範 HTML 4.01 標記語言的使用 作者:張凱慶 時間:西元 2011 年 5 月 --> |
注意 <meta /> 的這一行
4 5 | < meta http-equiv = 'refresh' content = '5; URL=example06.html' /> |
content 屬性中,第一個值給的是整數 5 ,表示秒數,後面接頓號,然後接 URL=example06.html ,這就是更新後的網址。
所以,用瀏覽器 (broswer) 開啟 example05.html 如下

五秒後更新到 example06.html

example06.html 原始碼如下
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | < html > < head > < title >網頁標題</ title > </ head > < body > 這是 example06.html 。 </ body > </ html > <!-- 《程式語言教學誌》的範例程式 檔名:example06.html 功能:示範 HTML 4.01 標記語言的使用 作者:張凱慶 時間:西元 2011 年 5 月 --> |
http-equiv 另一個功能是設定文件編碼,例如以下例子將網頁設定成 Big5 編碼
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | < html > < head > < title >網頁標題</ title > < meta http-equiv = 'content-type' content = 'text/html; charset=big5' /> </ head > < body > 這是 example07.html 。 </ body > </ html > <!-- 《程式語言教學誌》的範例程式 檔名:example07.html 功能:示範 HTML 4.01 標記語言的使用 作者:張凱慶 時間:西元 2011 年 5 月 --> |
同樣的, <meta /> 這一行
4 5 | < meta http-equiv = 'content-type' content = 'text/html; charset=big5' /> |
content 屬性中,第一個值是設定文件型態,這裡是 text/html ,表示純文字的 HTML 文件,後面接頓號,然後接 charset=big5 , big5 為中文的大五碼,也是 MS-Windows 中文系統預設的編碼方式。
我們用瀏覽器開啟 example07.html ,如下

咦,亂碼?這是因為大五碼只通用在 MS-Windows 的中文系統,其他眾多平台可就不一定了說。因此,設定成 UTF-8 會是比較保險的作法,例如
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | < html > < head > < title >網頁標題</ title > < meta http-equiv = 'content-type' content = 'text/html; charset=utf8' /> </ head > < body > 這是 example08.html 。 </ body > </ html > <!-- 《程式語言教學誌》的範例程式 檔名:example08.html 功能:示範 HTML 4.01 標記語言的使用 作者:張凱慶 時間:西元 2011 年 5 月 --> |
用瀏覽器開啟 example08.html ,如下

這就正常了,是不是呢?UTF-8 由 Unicode 非營利組織維護,納入各國的文字符號,其中包括大部分的常用中文字。
中英文術語對照 | |
---|---|
標籤 | tag |
屬性 | attribute |
瀏覽器 | broswer |
您可以繼續參考
HTML 基本概念
- 元素與屬性
- 絕對路徑與相對路徑
- 度量與單位
- 網頁顏色
- 網頁字元索引
- 文件型態定義
- <html> - 文件標籤
- <head> - 文件標頭
- <title> - 標題
- <meta /> - 資訊
- <link /> - 外連樣式表
- <script> - 腳本程式
- <style> - 樣式
- <base> - 基本路徑
- <body> - 文件主體
- <address> - 作者資訊
相關目錄
HTML 4.01 快速導覽 - 目錄
HTML, CSS 教材
首頁
參考資料
沒有留言:
張貼留言