前端(一)：html標簽入門

　　HTML(Hypertext Markup Language)超文本標記語言，它負責頁面的結構。超文本指的是超鏈接，使用超鏈接可以從一個頁面跳轉到另一個頁面。

　　HTML的發展：1993年6月發佈第一個版本，1995年11月第二個版本，2000年底XHTML1.0，2014年HTML5.0。

1、標題 - h1~h6

　　標題(heading)是通過<h1> ~ <h6>來定義的，<h1>定義最大的標題，<h6>定義最小的標題。

　　瀏覽器會自動地在標題的前後添加空行。

　　預設情況下，HTML 會自動地在塊級元素前後添加一個額外的空行，比如段落、標題元素前後。

　　請確保將 HTML heading 標簽只用於標題。不要僅僅是為了產生粗體或大號的文本而使用標題。

2、段落 - p

　　段落是通過 <p> 標簽定義的。

　　瀏覽器會自動地在段落的前後添加空行。（<p> 是塊級元素）

　　使用空的段落標記 <p></p> 去插入一個空行是個壞習慣。用 <br /> 標簽代替它。

　　如果您希望在不產生一個新段落的情況下進行換行（新行），請使用 <br /> 標簽。

　　當顯示頁面時，瀏覽器會移除源代碼中多餘的空格和空行。所有連續的空格或空行都會被算作一個空格。

3、格式化文本

4、超鏈接 - a

<a href="http://www.w3school.com.cn/html/html_links.asp#tips">有用的提示</a>

　　在所有瀏覽器中，鏈接的預設外觀是：

• 未被訪問的鏈接帶有下劃線而且是藍色的
• 已被訪問的鏈接帶有下劃線而且是紫色的
• 活動鏈接帶有下劃線而且是紅色的

　　如果不使用 href 屬性，則不可以使用如下屬性：download, hreflang, media, rel, target 以及 type 屬性。

　　被鏈接頁面通常顯示在當前瀏覽器視窗中，除非您規定了另一個目標（target 屬性）。

　　最好使用 CSS 來設置鏈接的樣式。

5、圖像 - img

<img src="boat.gif" alt="Big Boat">

　　在 HTML 中，圖像由 <img> 標簽定義。要在頁面上顯示圖像，你需要使用源屬性（src）。

　　src 指 "source"。源屬性的值是圖像的 URL 地址。

　　alt 屬性用來為圖像定義一串預備的可替換的文本。替換文本屬性的值是用戶定義的。在瀏覽器無法載入圖像時，替換文本屬性告訴讀者她們失去的信息。

6、表格 - table tr td

<table border="1">
    <tr>
        <th>Heading</th>
        <th>Another Heading</th>
    </tr>
    <tr>
        <td>row 1, cell 1</td>
        <td>row 1, cell 2</td>
    </tr>
    <tr>
        <td>row 2, cell 1</td>
        <td>row 2, cell 2</td>
    </tr>
</table>            

　　表格由 <table> 標簽來定義。

　　表格的表頭使用 <th> 標簽進行定義。大多數瀏覽器會把表頭顯示為粗體居中的文本。表頭是可選的。

　　每個表格均有若幹行（由 <tr> 標簽定義），每行被分割為若幹單元格（由 <td> 標簽定義）。

　　字母 td 指表格數據（table data），即數據單元格的內容。數據單元格可以包含文本、圖片、列表、段落、表單、水平線、表格等等。

　　假如一個表格內沒有數據時，該表格內用空格<td>&nbsp;</td>填充。

7、列表 - ul、ol、dl

　　1.無序列表

　　無序列表是一個項目的列表，此列項目使用粗體圓點（典型的小黑圓圈）進行標記。

　　無序列表始於 <ul> 標簽。每個列表項始於 <li>。

　　列表項內部可以使用段落、換行符、圖片、鏈接以及其他列表等等。

<ul>
    <li>Coffee</li>
    <li>Milk</li>
</ul>

　　2.有序列表

　　有序列表也是一列項目，列表項目使用數字進行標記。

　　有序列表始於 <ol> 標簽。每個列表項始於 <li> 標簽。

　　列表項內部可以使用段落、換行符、圖片、鏈接以及其他列表等等。

<ol>
    <li>Coffee</li>
    <li>Milk</li>
</ol>

　　3.自定義列表

　　自定義列表不僅僅是一列項目，而是項目及其註釋的組合。

　　自定義列表以 <dl> 標簽開始。每個自定義列表項以 <dt> 開始。每個自定義列表項的定義以 <dd> 開始。

　　定義列表的列表項內部可以使用段落、換行符、圖片、鏈接以及其他列表等等。

<dl>
    <dt>Coffee</dt>
    <dd>Black hot drink</dd>
    <dt>Milk</dt>
    <dd>White cold drink</dd>
</dl>

　　大多數網站最下麵的info都可以用自定義列表來寫。

8、表單 - form

<form action="url" method="post" ...>
    ...
     input 元素
    ...
</form>

　　表單使用表單標簽（<form>）定義。

　　表單是一個包含表單元素的區域。

　　表單元素是允許用戶在表單中（比如：文本域、下拉列表、單選框、覆選框等等）輸入信息的元素。

　　action屬性定義了目的文件的文件名。由動作屬性定義的這個文件通常會對接收到的輸入數據進行相關的處理。

　　method屬性定義了數據傳輸方式。

 　　1.文本框、密碼框和提交按鈕

<form>
    用戶名:
    <input type="text" name="username" />
    <br />
    密 碼:
    <input type="password" name="pwd" />
    <br />
    <input type="submit" value="提交">
</form>

　　在大多數瀏覽器中，文本域的預設寬度是20個字元。

　　2.單選框

<form>
    <input type="radio" name="sex" value="male" /> Male
    <br/>
    <input type="radio" name="sex" value="female" /> Female
</form>

　　3.覆選框

<form>
    <input type="checkbox" name="apple" />I have a apple
    <br />
    <input type="checkbox" name="pen" />I have a pen
</form>

 9、靜態資源

　　href、src和url可以請求靜態資源(html、css、js、image)的路徑。因此，和其它request請求一樣，在後端(前後端分離)需要為其寫介面。寫純socket web練習時，即使本地用到jquery等，也要為其寫一個視圖函數來讀取。