前端系列之HTML基礎知識概述
1、什麽是HTML
HTML：Hyper Text Markup Language ：超文本標記語言。
超文本：功能比普通文本更加強大。
標記語言：使用一組標簽對內容進行描述的語言，它不是編程語言。
2、HTML能幹什麽
HTML用於編寫網頁，平時上網通過瀏覽器我們看到的大部分頁面都是由html編寫的。在瀏覽器訪問網頁時，可以通過“右鍵/查看網頁源代碼”看到具體的html代碼。
網頁內容包含：HTML代碼、css代碼、JavaScript代碼等內容。
HTML代碼：用於展示需要顯示的數據。
css代碼：使顯示的數據更佳好看。
JavaScript代碼：使整個頁面顯示的數據具有動畫效果。
網頁根據內容是否改變分為：靜態頁面、動態頁面
靜態頁面：編寫之後在瀏覽器不再改變的網頁。HTML就是用於編寫靜態網頁的。 動態頁面：會根據不同的情況展示不同的內容。例如：登錄成功後右上角顯示用戶名。
3、HTML語法和規範
HTML文件都是以.html或者.htm結尾的。建議使用.html結尾。
HTML文件分為頭部分(head)和體部分(body)。
HTML標簽都是由開始標簽和結束標簽組成。
HTML標簽不區分大小寫，建議使用小寫。
4、HTML語言特點
HTML文件不需要編譯，直接使用瀏覽器閱讀即可過 HTML文件的擴展名是*．htm。
標簽名是預先定義好的，我們只需要了解其功能即可。通常情況下標簽由開始標簽和結束標簽組成。例如：標簽名不區分大小寫。
如果沒有結束標簽，建議以/結尾。HTML結構包括兩部分： 頭head和體body
5、HTML 文本標簽
（1）、標題標簽：從<h1>到<h6>逐漸變小(加粗加黑顯示) （2）、水平線標簽：<hr/> （3）、段落標簽：<p> （4）、字體標簽：<font 屬性=值>內容</font> color:設置字體的顏色，可使用英文單詞或者 16 進制 size：設置字體的大小，從 1 到 7 逐漸變大，最大顯示為 7 face：設置字體
6、HTML表單
（1）、表單標簽：<form>
<form>表單標簽，在html頁面創建一個表單，表單標簽在瀏覽器上沒有任何顯示。如果數據需要提交到服務器，負責搜集數據的標簽必須存放在表單標簽體內容。
(1)、action屬性：請求路徑，確定表單提交到服務器的地址（路徑） (2)、method屬性：請求方式。常用的取值：GET、POST
GET：默認值 1）、提交的數據追加在請求路徑上。例如：/1.html?username=jack&password=1234,數據格式k/v,追加是使用？連接，之後每一對數據使用&連接 2）、因為請求路徑長度有限，所有GET請求提交的數據有限。
POST： 1）、提交的數據不再請求路徑上追加（及不顯示在地址欄上） 2）、提交的數據大小不顯示
(3)、數據提交：
<body> <form action="" method=""> <！--此處的內容可能被提交到服務器--> </form> <！--此處的內容在<form>標簽外部，此處數據不能提交到表單--> </body>
（2）、輸入域標簽：<input>
<input>標簽用於獲得用戶輸入信息，type屬性值不同，搜集方式不同。最常用的標簽。
（1）、type屬性 1）、text：文本框，單行的輸入字段，用戶可在其中輸入文本。默認寬度為20個字符 2）、password：密碼框，密碼字段。該字段中的字符以黑圓顯示。 3）、radio：單選框，表示一組互斥選項按鈕中的一個。當一個按鈕被選中，之前選中的按鈕就變為非選中的。 4）、submit：提交按鈕。提交按鈕會把表單數據發送到服務器。一般不寫name屬性，否則將“提交”兩個字提交到服務器。 因為不同項目註冊需要的字段不同，需要完成的案例中沒有覆蓋所有的表單元素，以下標簽使用也需要大家掌握。 5）、checkbox：復選框 6）、file：文件上傳組件，提供"瀏覽"按下可以選擇需要上傳文件 7）、hidden：隱藏字段·數據會發送給服務器，但瀏覽器不進行顯示 8）、reset：重置按鈕。將表單恢復到默認值 9）、image：圖形提交按鈕，通過src給按鈕設置圖片 10）、button：普通按鈕，常用於與JavaScript結合使用
（2）、name：元素名，如果需要表單數據提交到服務器，必須提供name屬性值，服務器通過屬性值獲得提交的數據。
（3）、value屬性：設置input標簽的默認值。submit和reset為按鈕顯示數據
（4）、size：大小
（5）、checked屬性：單選框或復選框被選中
（6）、readonly：設置為僅可讀
（7）、disabled：是否可用
（8）、maxiength：允許輸入的最大長度
（3）、下拉列表標簽：<select>
<select>下拉列表。可以進行單選或多選。需要使用子標簽`<option>`指定列表項
（1）、name屬性：發送給服務器的名稱
（2）、multiple屬性：不寫默認單選，取值為"multiple"表示多選
（3）、size屬性：多選時，可見選項的數目
（4）、<option>子標簽：下拉列表中的一個選項（一個條目）
1）、selected：勾選當前列表項
2）、value：發送給服務器的選項值
（4）、文本域標簽：<textarea>
<textarea>文本域。多行的文本輸入控件。
（1）、cols屬性：文本域的列數 （2）、rows屬性：文本域的行數
（5）、按鈕標簽：<button>
按鈕標簽一般很少使用，提供“普通|重置|提交”功能，不同的瀏覽器默認值不同。
<button type="" button|reset|submit">掃碼關註微信公眾號，了解更多
前端系列之HTML基礎知識概述