--- tags: HTML, 六角筆記王 title: HTML - 網頁初始結構 --- # 網頁初始結構 ![image alt](https://i.imgur.com/ge1Ghy2.gif) ## ▶ 初始化 要如何在網頁中，開始寫我們的標籤呢? 首圖範例中，是以 emmet 快速展開的基礎標籤格式，可以看到基礎結構為: ```htmlembedded= <!DOCTYPE html> <html lang="en"> <!-- 網頁語系，台灣為 zh-Hant 或是 zh-Hant-TW --> <head> <!-- 編碼 --> <meta charset="UTF-8"> <!-- 網頁相容性，此為 IE 兼容設定 --> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- 依據讀取網頁的裝置大小設定網頁寬度，設定畫面的初始縮放比例 --> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!-- 網頁名稱，可以在瀏覽器最上方看到 --> <title>HTML - 網頁初始結構</title> </head> <body> </body> </html> ``` 可以拆解成： | 標籤名稱 | 用途 | | -------- | -------- | | `<!DOCTYPE html>` | 文件型別宣告，告訴瀏覽器這是甚麼檔案 | | `<html></html>`| 網頁文件最上層 | | `<head></head>` | 網頁文件開頭描述，可以定義一些資本資訊 | | `<body></body>` | 網頁內容撰寫處 | ## 參考來源 > 1. [Fooish 程式技術 - HTML DOCTYPE 檔案類型聲明](https://www.fooish.com/html/doctype.html) > 2. [小艾 ( iris ) - Day13：小事之 HTML viewport 與 meta tag](https://ithelp.ithome.com.tw/articles/10195279)