今天想整理記錄 <head> 裡可以放的標籤以及內容。
這是一份常見的 HTML 文件，
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Title of the document</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
The content of the document......
</body>
</html>
<head> Tag<head> 標籤是裝有 metadata 的容器，而 metadata 是表示這份 HTML 文件的相關訊息，且並不會顯示在頁面上。
Metadata 通常定義了這份文件的標題 (title)、字符集 (character set)、樣式 (styles)、腳本 (scripts)以及其他資訊。
以下是可以放在 <head> 裡的標籤：
<title>
<style>
<base>
<link>
<meta>
<script>
<noscript>
<title>指這份文件的標題，會出現在瀏覽器的標題欄或是加入我的最愛時的名稱。
<title>編輯草稿 - iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天</title>
而且是必須在文件中定義的資訊，另外也對 SEO 很重要，會影響搜索引擎的搜尋結果。
<style>可以在 <style> 內書寫 CSS 樣式，CSS 樣式會套用在 HTML 標籤。
<base>為這份文件中設定所有連結類型標籤 (例如 <a> 的 href、<img> 的 src) 的預設根網址與預設連結目標。
<head>
<base href="https://www.w3schools.com/" target="_blank">
</head>
<body>
<a href="tags/tag_base.asp">HTML base Tag</a>
<img src="images/photo.jpg">
</body>
點選 <a> 超連結，會另開視窗到 https://www.w3schools.com/tags/tag_base.asp。
而 <img> 會連到 https://www.w3schools.com/images/photo.jpg (假設)
以下屬性至少要有一個
<link>定義了這份文件與外部資源的關係，常用於引入外部 CSS 文件檔案。
<head>
<link rel="stylesheet" href="styles.css">
</head>
屬性
rel="icon"，例如 16x16<meta>表示 HTML 文件的 metadata，通常用於指定字符集 (character set)、網頁描述 (page description)、關鍵字 (keywords)、文件作者以及設定可視區 (viewport)等。
屬性
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author" content="Ron">
<!-- Refresh the page every 5 seconds -->
<meta http-equiv="refresh" content="5">
<!-- Redirect instantly to https://cssreference.io -->
<meta http-equiv="refresh" content="0; url=https://cssreference.io">
<script>可以在 <script> 內直接書寫 JavaScript 程式碼，或是通過 src 屬性載入外部 JavaScript 檔案。
屬性
<noscript>為當瀏覽器不支援 JavaScript 或使用者手動關閉禁止 JavaScript 執行時，可以用來顯示給使用者的一些訊息。正常可支援 JavaScript 的瀏覽器會跳過 <noscript> 中的內容。
<noscript>
<p>此網頁需要支援 JavaScript 才能正確運行，請先至你的瀏覽器設定中開啟 JavaScript。</p>
</noscript>
參考資料：
W3Schools - HTML head Tag
Fooish 程式技術 - HTML文章同步更新於 medium
iThome鐵人賽
看影片追技術
