HTML標籤：
1、概念：是最基礎的網頁開發語言
Hyper Text Markup Language 超文本標記語言
超文本：
使用超鏈接的方法，將各種不同空間的文字信息組織在一起的網狀文本
標記語言：
由標籤構成的語言， <標籤名稱>如 html,htm
標記語言不是編程語言
2、快速入門
語法：
1.html文檔後綴名 .html 或 .htm
2.標籤分爲
1.圍堵標籤：<html></html>
2.自閉合標籤：<br/>
3.標籤可以嵌套
4.在開始標籤中可以定義屬性，屬性是由鍵值對構成的，值需要使用引號引起來（單雙都可以）
5.html不區分大小寫，但是建議小寫
代碼：
<html>
<head>
<meta charset="utf-8">
<title>title</title>
</head>
<body>
<font color="red">hello world</font><br/>
<font color="green">hello world</font>
</body>
</html>
3、標籤學習：
1.文件標籤：構成html最基本的標籤
* html: html文檔的根標籤
* head: 頭標籤，指定html文檔的一些屬性，引入外部資源
* title: 標題標籤
* body: 體標籤
* <!DOCTYPE html> html5中定義文件類型
2.文本標籤：和文本有關的標籤
* <h1> to <h6>：標題標籤,字體大小逐漸變小
* <br>：換行標籤
* <hr>： 一條橫線
* <p> ：段落標籤
* <b> ：字體加粗
* <I> ：斜體
* <center>：居中
*<font>:字體標籤
*屬性
*color:顏色
*size:大小
*face:字體
*屬性定義：
*color：
1.英文單詞：red, green,blue
2.rbg(值1，值2，值3)：值的範圍：0～255 如 rbg(0,0,255)
3.#值1值2值3：值的範圍：00～FF 如 #FF00FF
*width:
1.數值：300px(像素)
2.百分比：相對於父容器
3.圖片標籤
<img src = “./image/1.jpg”>
*相對路徑：./：代表當前路徑
../：代表上一級路徑
4.列表標籤
*有序列表
* ol
* li
*無序列表
* ul
* li
5.鏈接標籤
<a href=“"target="_blank"></a>
6.<span>和<div>
7.語義化標籤
<header></header>
<footer></footer>
8.表格標籤
*<table>: 定義表格
*width：寬度
*border：邊框
*cellpadding: 定義邊框與內容距離
*cellspacing：定義單元格之間距離
*bicolor：背景色
*align：對齊方式
*<tr>: 定義行
*<thead>
*<tbody>
*<tfoot>
*<td>: 定義列
*<colspan>：合併列
*<rowspan>：合併行
9.表單標籤
*<form>：用於定義表單的，可以定義一個範圍，範圍代表採集用戶數據的範圍（表單屬性要想被提交，得指定 name 屬性）
<html>
<head>
<meta charset="utf-8">
<title>表單標籤</title>
</head>
<body>
<form action="###" method="get">
姓名：<input name="username" /><br/>
密碼：<input name="password" /><br/>
<input type="submit" value="提交" />
</form>
</body>
</html>
效果：
屬性：
*action ：指定提交URL
*method：指定提交方式
get:
1.請求參數會在地址欄中顯示
2.請求參數大小有限制
3.不太安全
post:
1. 請求參數不會在地址欄中顯示
2. 請求參數大小沒有限制
3. 較爲安全
10.表單項標籤：
*input：可以通過 type 的屬性值改變元素的展示樣式
* text：文本輸入框，默認值 (placeholder：可以提示信息)
* label：label 的 for 屬性一般會和 input 的 id 屬性對應，對應之後點擊 label 區域，會讓 input 輸入框獲取焦點
* password：密碼輸入框
* radio：單選框
*注意：
1.要想讓單選框實現單選效果，則多個單選框的name屬性值必須一樣
2.一般會給每一個單選框提供value屬性，指定其被選後提交的值
3.checked屬性可以指定默認值
*checkbox：複選框
*file：文件選擇框
*color：取色器
*button：一個按鈕
*submit：提交
*select：下拉列表
11.下拉列表：
省份：<select name="province">
<option>請選擇</option>
<option>北京</option>
<option>上海</option>
<option>陝西</option>
</select>
12.textarea：文本域
自我描述： <textarea rows="5" cols="10" name="desc"></textarea>
4、實戰：註冊頁面
代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>註冊頁面</title>
</head>
<body>
<form action="#" method=post">
<table border="1" align="center" width="500" cellspacing="2" cellpadding="2">
<tr>
<td><label for="username">用戶名：</label></td>
<td><input type="text" name="username" id="username"></td>
</tr>
<tr>
<td><label for="password">密碼：</label></td>
<td><input type="password" name="password" id="password"></td>
</tr>
<tr>
<td><label for="email">email：</label></td>
<td><input type="email" name="email" id="email"></td>
</tr>
<tr>
<td><label for="name">姓名：</label></td>
<td><input type="text" name="name" id="name"></td>
</tr>
<tr>
<td><label for="tel">手機號碼：</label></td>
<td><input type="text" name="tel" id="tel"></td>
</tr>
<tr>
<td>性別：</td>
<td><input type="radio" name="gender" value="male">男
<input type="radio" name="gender" value="felmale”>女 </td>
</tr>
<tr>
<td><label for="birth">出生日期：</label></td>
<td><input type="date" name="birth" id="birth"></td>
</tr>
<tr>
<td colspan="2" align="center"><input type="submit" value="登錄"/></td>
</tr>
</table>
</form>
</body>
</html>
效果：
