Day 01
Author:ScorpioDong
HTML：超文本標記語言: HyperText Markup Language
1. HelloWorld
<!DOCTYPE html>
<html lang="zh_cn">
<head>
<meta charset="UTF-8">
<title>Day 01</title>
</head>
<body>
<h1>Hello HTML</h1>
<p>第一行代碼</p>
</body>
</html>
.html: 擴展名<!DOCTYPE html>: 聲明爲HTML5文檔<html>: HTML 頁面的根元素<head>: 包含了文檔的元（meta）數據，如<meta charset="utf-8">定義網頁編碼格式爲 utf-8。<body>: 包含了可見的頁面內容<h1>: 定義一個一級標題<p>: 定義了一個段落
2. HTML標籤（tag)
- HTML 標籤是由尖括號包圍的關鍵詞，比如
<html> - HTML 標籤通常是成對出現的，比如
<b>和</b> - 標籤對中的第一個標籤是開始標籤，第二個標籤是結束標籤
- 開始和結束標籤也被稱爲開放標籤和閉合標籤
<標籤>內容</標籤>>
3. <!DOCTYPE> 聲明
- 聲明用來告知Web瀏覽器文檔使用了什麼版本的HTML
<!DOCTYPE html>表示HTML5文檔
4. 中文編碼
<meta charset="UTF-8">: 將文檔編碼聲明爲UTF-8可以有效避免web瀏覽器中文亂碼問題<html lang="zh-CN">： 可以指定網頁爲中文網頁，zh-CN也可簡寫爲zh
5. HTML 基礎
5.1 標題
- HTML 標題（Heading）是通過
<h1> - <h6>標籤來定義的. - 請確保將 HTML 標題 標籤只用於標題。不要僅僅是爲了生成粗體或大號的文本而使用標題。
- 搜索引擎使用標題爲您的網頁的結構和內容編制索引。
- 因爲用戶可以通過標題來快速瀏覽您的網頁，所以用標題來呈現文檔結構是很重要的。
- 應該將 h1 用作主標題（最重要的），其後是 h2（次重要的），再其次是 h3，以此類推。
- 1到6號標題與1到6號字體逆序對應，比如1號字體對應6號標題，2號字體對應5號標題。
<h1>一級標題</h1>
<h2>二級標題</h2>
<h3>三級標題</h3>
<h4>四級標題</h4>
<h5>五級標題</h5>
<h6>六級標題</h6>
一級標題
二級標題
三級標題
四級標題
五級標題
六級標題
5.2 段落
- HTML 段落是通過標籤
<p>來定義的. - 瀏覽器會自動地在段落的前後添加空行。
<br>標籤可以對段落折行.- HTML 代碼中的所有連續的空行（換行）會認爲是一個空行（換行）也被顯示爲一個空行（換行）
<p>這是一個段落</p>
<p>這是<br>另一個段落</p>
這是一個段落
這是
另一個段落
5.3 HTML 鏈接
- HTML 鏈接是通過標籤
<a>來定義的.
<a href="https://www.baidu.com">百度搜索</a>
5.4 HTML 圖像
- HTML 圖像是通過標籤
<img>來定義的. - 圖像的名稱和尺寸是以屬性的形式提供的.
- alt 屬性用來爲圖像定義一串預備的可替換的文本，當圖片無法顯示時，替換文本屬性告訴讀者失去的信息
<img src="../img/icon.jpg" width="500" height="375" alt="icon"/>
6. HTML 屬性
- HTML 元素可以設置屬性
- 屬性可以在元素中添加附加信息
- 屬性一般描述於開始標籤
- 屬性總是以名稱/值對的形式出現，比如：
name="value" - 屬性值應該始終被包括在引號內
- 雙引號是最常用的，不過使用單引號也沒有問題(有些屬性值中存在雙引號的，必須使用單引號包含)
適用於大多數 HTML 元素的屬性
| 屬性 | 描述 |
| class | 爲html元素定義一個或多個類名（classname）(類名從樣式文件引入) |
| id | 定義元素的唯一id |
| style | 規定元素的行內樣式（inline style） |
| title | 描述了元素的額外信息 (作爲工具條使用) |
7. 註釋和水平線
- HTML 使用
<!-- -->作爲註釋，被註釋的內容不會被瀏覽器解析 <hr>標籤在 HTML 頁面中創建水平線。
<!-- 這是一個註釋 -->
<p>上</p>
<hr>
<p>下</p>
上
下