HTML
前言
希望此篇文章能夠幫助到你們，這些都是基於我日常學習中的總結，也許有些不嚴謹，望指出，若你擁有編輯的功能，則在你所認為錯誤的地方划掉而非刪除，然后使用紅色筆進行編輯對的，新的內容。
此文章基於XHTML1.0和HTML5標准，其實說是標准，只是我們所需遵守的最低標准罷了。
轉載標注來源，作者：Chongsaid
工具
不建議新手使用任何自動完成功能的編輯器作為新初使用，因為最終你會產生依賴性，離開工具就無法創作出所需要的網頁效果了。
我在百度雲盤分享了一款工具，針對於新手使用的，代碼高亮顯示
工欲善其事，必先利其器，先下載你的工具來開始驗證在此文章所討論的知識點以及部分總結。
鏈接: https://pan.baidu.com/s/1dFMWP5v 密碼: xbad
其實，工具只是幫助我們達到目的而已，你也可以使用記事本進行開發。
實用的學習參考網站在某種意義上來說，其實也算是一種工具。
W3CSchool ：http://www.w3school.com.cn/index.html
這篇文章有很多資源將引用W3CSchool的教程，並且該網站的學習資源也很優秀。
開始
你已經下載工具了嗎？
那么開始吧。
HTML是互聯網組成的必不可少的一種標記性語言，我們所瀏覽的網頁大都基於HTML所提供。任何人都可以學習HTML技術，這其實屬於前端的技術范疇。
HTML稱為 超文本標記語言 ，具體可以上網進行搜索。
打開工具，或者在桌面上新建一個文件，將其命名為 index.html
*.html 其后輟名指的是HTML文件，可以使用任何瀏覽器打開此文件，這些瀏覽器會發揮文件的最大作用，而不是簡簡單單的文本文檔。
那么，如何編寫HTML文件呢？
打開任一網站，點按鍵盤上的 F12 鍵，就可以看到其網站的源代碼，觀看代碼並學習其實也是成長的一部分。
HTML5主要分為三部分（包括XHTML）
聲明部分、 頭部（head）、主體（body），其中，容器（html）包裹着頭部和主體。
XHTML有些版本區分大小寫，並且XHTML可能會在未來的某一個時候被HTML5所替代，所以本文章主要精力放在HTML5的知識點上。
實踐：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>網頁標題</title>
</head>
<body>
</body>
</html>
我們來逐步分析上面的實踐代碼。
<!DOCTYPE html> 此行是網頁聲明，用於告訴瀏覽器該如何解析此文檔時所使用的HTML或XHTML規范，通常HTML5的聲明格式一般如此。而XHTML的聲明格式很繁雜，它有三種聲明格式，我只寫松散（Loose）聲明，其余使用搜索引擎進行完善。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd " >
其余部分在之前已經講過，但head標簽之內的那些是什么呢？
<meta>標簽用於描述網頁的摘要信息，包括文檔內容類型，編碼信息，搜索關鍵字，網站功能等，采用鍵值對的方式描述信息。
<meta charset="utf-8" />這行代碼指示瀏覽器該以怎樣的編碼來解析文檔，有時候出現中文亂碼是因為解析文檔所用的格式錯誤了。
此標簽具體參閱：
百度百科：https://baike.baidu.com/item/meta/4265710?fr=aladdin
W3CSCHOOL：http://www.w3school.com.cn/tags/tag_meta.asp
<title>標簽定義文檔的標題，瀏覽器會以特殊的方式展示它，將其置於標簽頁上，收藏夾，書簽等。
主體：主要的展示平台
<body>標簽的作用正是展示信息的平台。
各式各樣的標簽都能在其中大放異彩，標題標簽，段落標簽，圖片標簽，盒子標簽.......
每一個標簽都需要成對出現，當然也有意外，因為它們天生如此。在后面介紹。
在此之前，我們先學習如何給文檔進行注釋，以此，我們在以后看到這些代碼的時候，也能夠知道當時我們的想法是怎樣的。
注釋標簽
<!-- 注釋內容 -->
瀏覽器不會解析注釋內容，因為對瀏覽器沒有用處，相反，注釋能給帶給開發者幫助。
下面開始介紹各式標簽，所有的網頁都基於此搭建而成，一個完整的網站會存在樣式表，它們能夠美化網站，當然，樣式表會在以后介紹。
標題標簽
<h1>一級標題</h1>
共六級，數值越大則標題大小越小，一個網頁標准的做法是只出現一次一級標簽，它們是整個網頁所需展示的重要摘要。
此標簽不多做介紹，進行嘗試，於<body>標簽內。而非網頁的頭部標題，是不一樣的。
段落標簽
<p>總結起初寫於2017年9月12號，是學習的經驗，知識分享，當然其中也不乏有錯，希望看這篇文章的道友能夠多多指點，修改錯誤的內容。</p>
段落標簽用於載入一段文字，或是一篇文章，<p>標簽會在前后創建一些空白以突出內容，可以使用樣式表美化它，當然，幾乎所有的標簽都可以使用樣式表進行美化。
值得注意的是，在源代碼中，如果有換行符，瀏覽器會采用空格來替代它們，因此需要換行的話，需要在源代碼的文章進行更改，采用換行標簽來替代源代碼中的換行。
進行嘗試，於<body>標簽內。
字體樣式標簽
在前面我們學習了兩種標簽，分別是 標題標簽和段落標簽 ，如果你沒看到，可以看看之前的介紹以及內容。
字體樣式標簽可以對字體產生影響，從而達到突出字體，讓其更為明顯，可以很直觀的看到。
主要的，且使用次數較多的樣式標簽如下：
<em> <strong> <dfn> <code> <samp> <kbd> <cite>
實際上，這些標簽都用於區分內容，以達到顯要的，強調開發者所要表達的事物，比如某些關鍵字，引用的文章內容，或是重要的信息。
作為簡短的介紹，我在知名HTML教學網站上看到了這些標簽的簡介，因此，在此不多做標簽介紹。
以上字體樣式標簽的簡介網址：http://www.w3school.com.cn/tags/tag_phrase_elements.asp
特殊符號
有些符號作為HTML的語法符號，在網頁實際中並不可見，因此，只能使用特定的轉義符來顯示它們。
在這里，我將寫一些常用的轉義符以達到讀者可以理解其作用。
空格（ ） 大於號（>） 小於號（<）
引號（"） 版權符號（©）
網頁支持的轉義符網址：http://www.w3school.com.cn/tags/html_ref_symbols.html
換行與水平線標簽
一個標簽可以使用樣式表進行美化與設置，有時候當沒有引用樣式表的時候，可以使用這些實用性標簽進行美化，這里就先介紹換行與水平線標簽。
你發現了沒有呢？標題標簽單獨占用了一行，而有些標簽則一個緊挨着一個。
其實，標簽分為兩類，分別為：塊級標簽和行內標簽（在CSS中，稱之為塊級元素以及行內元素）。
塊級標簽對於目前我們所學習的這些，並沒有能力改變它們......但我們能夠改變行內標簽。
<br />標簽，該標簽可以使行內標簽進行換行，如果在行內標簽前后各輸入此標簽，則該行內標簽將成為偽塊級標簽，在用戶看來，它單獨的占據了一行。
換行標簽僅僅只是簡單的開始新的一行，因此此標簽是一個空標簽，並無需成對出現。
有時候我們需要區分上下文內容，但若使用換行標簽會顯得有些突出，過於猛烈了。因此，可以使用分隔線來區分它們。
<hr />標簽，該標簽可以在上下文中，產生一條水平線，以此來分隔、區分內容，例如標題和文章內容。其含義實際上是單詞的縮寫：水平分隔線（horizontal rule）；
實踐
現在你掌握的知識其實已經能給制作一些很簡單的網頁，且擁有可瀏覽性。
開始進行實踐，來制作你的第二個網頁。
網頁源碼：
實際上也可以在<p>標簽內嵌套換行標簽達到換行的目的，但也可以在在所需換行的時候，創建一個新的<p>標簽以展示內容。
第二個實踐項目很簡單吧？其實，前端並非我們所想象的那樣復雜，只是我們在灌輸式教育前丟失了小時的創意......
入門
現在能夠單獨創建出一個簡單的頁面，頁面可以包含各樣文本，並且對其進行排列，使用水平線和換行達到像文章一樣的效果。
僅僅只是文本文檔而已，沒有超鏈接，圖片等，也只有單一的閱讀功能，並且，可能不會適配移動設備。
開始學習一些實用性標簽，擁有這些，才能稱之為一個網站。
圖像標簽
鏈接一張圖片到網頁上，可以對網頁進行一些簡要性的說明，或是網站Logo，也可以是某些演示圖片，這些都並非是文字可用於描述的，視覺往往比說的有用。
那么如何鏈接一張圖片呢？采用圖像標簽即可，其用法很簡單，常用屬性只有五個，我建議全部進行使用，因為可以很好的約束圖片，並且也遵守規范。
為什么要在標簽內定義寬高而不是使用CSS呢？
原因是，這關於瀏覽器的渲染機制，如果定義在標簽內，將得到更好的速度，因為瀏覽器的渲染順序如下：
標簽內的屬性 --> CSS樣式 --> 圖片原有大小。
<img src="圖像地址" alt="替代文本" title="鼠標懸浮提示文本" width="圖片寬度" hight="圖片高度" />
注意：在XHTML中，圖像標簽（img）必須被正確的結束，在HTML中，它是一個單標簽，無需結束。
XHTML示例：
<img 屬性="值" ......></img>
如果你不想使用五個屬性，可以根據需要進行刪減，但必要的兩個屬性：src、alt不能被刪除。
進行實踐。
注：圖像地址可以是本機的絕對路徑或是相對路徑，例如：D:/圖片.png，當然根據規范，圖片的命名建議使用英文。
圖片寬度或是高度采用的單位最好為像素，示例： width="500px" height="500px"
同樣，圖像地址可引用網絡中的圖片，例如：https://ss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3615363367,394874282&fm=27&gp=0.jpg
W3CSchool參考：
http://www.w3school.com.cn/tags/tag_img.asp
超鏈接標簽
超鏈接指的是，當鼠標單擊該標簽時，會跳轉到指定的界面，或是跳轉到某個錨點（具體參照HTML總結 “錨鏈接（未寫）”）。
超鏈接標簽也稱之為 a 標簽，它常用屬性只有兩種：href（被鏈接處）、target（目標窗口）
<a href="被鏈接的文檔或是文件" target="目標窗口" >文本或圖像</a>
其中，target屬性值如下：
_blank ：瀏覽器總在新打開、未命名的窗口載入目標文檔
_self ：默認值，除非與<base>標簽中的target屬性一起進行使用，否則毫無意義。
_parent：此目標使文檔載入父框架而非在當前窗口載入新的文檔
_top ：在窗口主體中載入被鏈接文檔
franename：在指定框架載入目標文檔
其余標簽的使用后續將會不斷完善。
在此之前，可以到此文永久更新地址進行查看：
