前端學習路徑：https://blog.csdn.net/qq_42736179/article/details/104089798
第一天：https://blog.csdn.net/qq_42736179/article/details/104089202
第二天：https://blog.csdn.net/qq_42736179/article/details/104093694
目錄
趣味導引
最好的編程學習方法應該就是閱讀源碼了，當你看到一個網頁時，是不是想知道它是如何實現的？
可以單擊鼠標右鍵選擇“查看源文件”或“查看頁面源代碼”就可以查看網頁源代碼了。
HTML元素
HTML元素是指從開始標籤到結束標籤的內容，可以進行嵌套。
大多數HTML標籤擁有屬性；例如img標籤。
空元素在開始標籤中進行關閉
HTML屬性
屬性是HTML元素的附加信息，在開始標籤中定義
<html>
<body bgcolor="yellow">
<h1 align="center"> This is heading </h1>
<p align="center"> This is article </p>
<a href="https://www.zhihu.com/"> This is Link </a>
<img scr="E://1.jpg" width="600" height="600" />
</body>
</html>
bgcolor :background color
align:排列（位置）
href:超鏈接
注意：此示例只爲了說明屬性，關於HTML樣式，後文有更好的方法設置。
第二天標籤
HTML註釋
示例：
<! -- 這是註釋，不會在網頁中 出現 -->
HTML分界線
標籤：<hr/>
注意：單個標籤的/在關鍵字後面，標籤對的結束標籤的/在關鍵字的前面。
作用：在頁面中創造分界線，用於分隔內容
試一試：
<html>
<body bgcolor="yellow">
<h1> h1 </h1>
<p> 1 </p>
</hr>
<! -- 用來分隔1和2 -->
<p> 2 </p>
</body>
</html>
注意：不是隻有hr有分隔作用，其他標籤在之後學習中積累。
HTML空行
<html>
<body>
<p>這是段落。可以寫好多好多，但是它們都是一段。這是段落。可以寫好多好多，但是它們都是一段。這是段落。可以寫好多好多，但是它們都是一段。這是段落。可以寫好多好多，但是它們都是一段。這是段落。可以寫好多好多，但是它們都是一段。</p>
<p>每一對標籤p都是一段。</p>
<p>瀏覽器會自動的在每一段的上下添加空行</p>
<hr/>
<p>但是不建議用不含內容的p來添加空行</p>
<br/>
<p>用br添加空行</p>
</body>
</html>
可以使用<p></p>來添加空行，但不支持這樣做。
正確做法：使用<br/>添加空行。
br的其他用法
如果在一段<p>中，你希望在不產生新的段落的情況下換行，可以使用<br/>
<html>
<body>
<p>
武漢加油<br />！湖北加油！<br />中國加油！<br /><br />新型冠型病毒bs
</p>
</body>
</html>
注意：
對於 HTML，您無法通過在 HTML 代碼中添加額外的空格或換行來改變輸出的效果。
提出問題：怎麼樣纔可以控制網頁展示的元素格式？
重點內容1：Style屬性直擊HTML樣式
推薦用style屬性來控制HTML樣式
<html>
<body>
<h1 style="text-align:right"> This is heading </h1>
<h2 style="background-color:yellow"> This is Heading </h2>
<p style="font-family:arial; color:red; font-size:20px;"> This is <br/>article </p>
</body>
</html>
重點內容2：文本格式化
學習方法推薦：掌握縮寫對應的英文意思，有助於理解標籤的意思
注意：以下標籤必須一個一個的應用過去。
文本格式化標籤
| 標籤 | 描述 |
|---|---|
| <b> | 定義粗體文本。 |
| <big> | 定義大號字。 |
| <em> | 定義着重文字。 |
| <i> | 定義斜體字。 |
| <small> | 定義小號字。 |
| <strong> | 定義加重語氣。 |
| <sub> | 定義下標字。 |
| <sup> | 定義上標字。 |
| <ins> | 定義插入字。 |
| <del> | 定義刪除字。 |
<html>
<body>
<pre>
這裏是預留 文本，保留空格和空行，
適用於展示代碼。
</pre>
<b> 這裏是黑體 </b>
<br/>
<big> 這裏是大號字 </big>
<br/>
<em> 這裏是着重字 </em>
<br/>
<! -- br的作用是換行，即這些是同一個段落 -->
</body>
</html>
“計算機輸出”標籤
| 標籤 | 描述 |
|---|---|
| <code> | 定義計算機代碼。 |
| <kbd> | 定義鍵盤碼。 |
| <samp> | 定義計算機代碼樣本。 |
| <tt> | 定義打字機代碼。 |
| <var> | 定義變量。 |
| <pre> | 定義預格式文本。 |
<html>
<body>
<code>
輸入代碼
</code>
</body>
</html>
引用、引用的術語定義
| 標籤 | 描述 |
|---|---|
| <abbr> | 定義縮寫。 |
| <acronym> | 定義首字母縮寫。 |
| <address> | 定義地址。 |
| <bdo> | 定義文字方向。 |
| <blockquote> | 定義長的引用。 |
| <q> | 定義短的引用語。 |
| <cite> | 定義引用、引證。 |
| <dfn> | 定義一個定義項目。 |
<html>
<body bgcolor="blue">
The <abbr title="backgroundcolor"> bdcolor </abbr> is blue
The <acronym title="World War Three"> WWT </acronym>
<address>
Written by <a href="mailto:[email protected]">Donald Duck</a>.<br>
Visit us at:<br>
ten
</address>
</body>
</html>
abbr
屬性:title=要縮寫的單詞
元素爲其縮寫
acronym
屬性：title=要首字母縮寫的單詞
元素爲其縮寫
