---恢復內容開始---
HTML 表單和輸入
HTML 表單用於搜集不同類型的用戶輸入。
表單
表單是一個包含表單元素的區域。
表單元素是允許用戶在表單中（比如：文本域、下拉列表、單選框、復選框等等）輸入信息的元素。
表單使用表單標簽（<form>）定義。
<form>
...
input 元素
...
</form>
輸入
多數情況下被用到的表單標簽是輸入標簽（<input>）。輸入類型是由類型屬性（type）定義的。大多數經常被用到的輸入類型如下：
文本域（Text Fields）
當用戶要在表單中鍵入字母、數字等內容時，就會用到文本域。
<form>
First name:
<input type="text" name="firstname" />
<br />
Last name:
<input type="text" name="lastname" />
</form>
瀏覽器顯示如下：
注意，表單本身並不可見。同時，在大多數瀏覽器中，文本域的缺省寬度是20個字符。
單選按鈕（Radio Buttons）
當用戶從若干給定的的選擇中選取其一時，就會用到單選框。
<form>
<input type="radio" name="sex" value="male" /> Male
<br />
<input type="radio" name="sex" value="female" /> Female
</form>
瀏覽器顯示如下：
注意，只能從中選取其一。
復選框（Checkboxes）
當用戶需要從若干給定的選擇中選取一個或若干選項時，就會用到復選框。
<form>
<input type="checkbox" name="bike" />
I have a bike
<br />
<input type="checkbox" name="car" />
I have a car
</form>
瀏覽器顯示如下：
表單的動作屬性（Action）和確認按鈕
當用戶單擊確認按鈕時，表單的內容會被傳送到另一個文件。表單的動作屬性定義了目的文件的文件名。由動作屬性定義的這個文件通常會對接收到的輸入數據進行相關的處理。
<form name="input" action="html_form_action.asp" method="get">
Username:
<input type="text" name="user" />
<input type="submit" value="Submit" />
</form>
瀏覽器顯示如下：
假如您在上面的文本框內鍵入幾個字母，然后點擊確認按鈕，那么輸入數據會傳送到 "html_form_action.asp" 的頁面。該頁面將顯示出輸入的結果。
更多實例
- 復選框
- 本例演示如何在 HTML 頁中創建復選框。用戶可以選中或取消選取復選框。
-
- 單選按鈕
- 本例演示如何在 HTML 中創建單選按鈕。
- 簡單的下拉列表
- 本例演示如何在 HTML 頁面中創建簡單的下拉列表框。下拉列表框是一個可選列表。
-
- 另一個下拉列表
- 本例演示如何創建一個簡單的帶有預選值的下拉列表。（編者注：預選值指預先指定的首選項。）
-
- 文本域(Textarea)
- 本例演示如何創建文本域（多行文本輸入控件）。用戶可在文本域中寫入文本。可寫入字符的字數不受限制。
-
- 創建按鈕
- 本例演示如何創建按鈕。你可以對按鈕上的文字進行自定義。
-
- Fieldset around data
- 本例演示如何在數據周圍繪制一個帶標題的框。
-
表單實例
- 帶有輸入框和確認按鈕的表單
- 本例演示如何向頁面添加表單。此表單包含兩個輸入框和一個確認按鈕。
-
- 帶有復選框的表單
- 此表單包含三個復選框和一個確認按鈕。
-
- 帶有單選按鈕的表單
- 此表單包含兩個單選框和一個確認按鈕。
-
- 從表單發送電子郵件
- 此例演示如何從表單發送電子郵件。
-
HTML 框架
通過使用框架，你可以在同一個瀏覽器窗口中顯示不止一個頁面。
框架
通過使用框架，你可以在同一個瀏覽器窗口中顯示不止一個頁面。每份HTML文檔稱為一個框架，並且每個框架都獨立於其他的框架。
使用框架的壞處：
- 開發人員必須同時跟蹤更多的HTML文檔
- 很難打印整張頁面
- 框架結構標簽（<frameset>）
-
- 框架結構標簽（<frameset>）定義如何將窗口分割為框架
- 每個 frameset 定義了一系列行或列
- rows/columns 的值規定了每行或每列占據屏幕的面積
編者注：frameset 標簽也被某些文章和書籍譯為框架集。
框架標簽（Frame）
Frame 標簽定義了放置在每個框架中的 HTML 文檔。
在下面的這個例子中，我們設置了一個兩列的框架集。第一列被設置為占據瀏覽器窗口的 25%。第二列被設置為占據瀏覽器窗口的 75%。HTML 文檔 "frame_a.htm" 被置於第一個列中，而 HTML 文檔 "frame_b.htm" 被置於第二個列中：
<frameset cols="25%,75%"> <frame src="frame_a.htm"> <frame src="frame_b.htm"> </frameset>
基本的注意事項 - 有用的提示：
假如一個框架有可見邊框，用戶可以拖動邊框來改變它的大小。為了避免這種情況發生，可以在 <frame> 標簽中加入：noresize="noresize"。
為不支持框架的瀏覽器添加 <noframes> 標簽。
重要提示：不能將 <body></body> 標簽與 <frameset></frameset> 標簽同時使用！不過，假如你添加包含一段文本的 <noframes> 標簽，就必須將這段文字嵌套於 <body></body> 標簽內。（在下面的第一個實例中，可以查看它是如何實現的。）
更多實例
- 如何使用 <noframes> 標簽
- 本例演示：如何使用 <noframes> 標簽。
-
- 混合框架結構
- 本例演示如何制作含有三份文檔的框架結構，同時將他們混合置於行和列之中。邊框可以移動。
-
- 含有 noresize="noresize" 屬性的框架結構
- 本例演示 noresize 屬性。在本例中，框架是不可調整尺寸的。在框架間的邊框上拖動鼠標，你會發現邊框是無法移動的。
-
- 導航框架
- 本例演示如何制作導航框架。導航框架包含一個將第二個框架作為目標的鏈接列表。名為 "contents.htm" 的文件包含三個鏈接。
-
- 內聯框架
- 本例演示如何創建內聯框架（HTML 頁中的框架）。
-
- 跳轉至框架內的一個指定的節
- 本例演示兩個框架。其中的一個框架設置了指向另一個文件內指定的節的鏈接。這個"link.htm"文件內指定的節使用 <a name="C10"> 進行標識。
-
- 使用框架導航跳轉至指定的節
- 本例演示兩個框架。左側的導航框架包含了一個鏈接列表，這些鏈接將第二個框架作為目標。第二個框架顯示被鏈接的文檔。導航框架其中的鏈接指向目標文件中指定的節。
-
HTML Iframe
添加 iframe 的語法
<iframe src="URL"></iframe>
URL 指向隔離頁面的位置。
Iframe - 設置高度和寬度
height 和 width 屬性用於規定 iframe 的高度和寬度。
屬性值的默認單位是像素，但也可以用百分比來設定（比如 "80%"）。
實例
<iframe src="demo_iframe.htm" width="200" height="200"></iframe>
Iframe - 刪除邊框
frameborder 屬性規定是否顯示 iframe 周圍的邊框。
設置屬性值為 "0" 就可以移除邊框：
實例
<iframe src="demo_iframe.htm" frameborder="0"></iframe>
使用 iframe 作為鏈接的目標
iframe 可用作鏈接的目標（target）。
鏈接的 target 屬性必須引用 iframe 的 name 屬性：
實例
<iframe src="demo_iframe.htm"
name="iframe_a"></iframe> <p><a href="http://www.w3school.com.cn" target="iframe_a">W3School.com.cn</a></p>
HTML 4.01 快速參考
來自 W3School 的 HTML 快速參考。可以打印它，以備日常使用。
HTML Basic Document
<html> <head> <title>Document name goes here</title> </head> <body> Visible text goes here </body> </html>Text Elements
<p>This is a paragraph</p> <br> (line break) <hr> (horizontal rule) <pre>This text is preformatted</pre>Logical Styles
<em>This text is emphasized</em> <strong>This text is strong</strong> <code>This is some computer code</code>Physical Styles
<b>This text is bold</b> <i>This text is italic</i>Links, Anchors, and Image Elements
<a href="http://www.example.com/">This is a Link</a> <a href="http://www.example.com/"><img src="URL" alt="Alternate Text"></a> <a href="mailto:webmaster@example.com">Send e-mail</a>A named anchor: <a name="tips">Useful Tips Section</a> <a href="#tips">Jump to the Useful Tips Section</a>Unordered list
<ul> <li>First item</li> <li>Next item</li> </ul>Ordered list
<ol> <li>First item</li> <li>Next item</li> </ol>Definition list
<dl> <dt>First term</dt> <dd>Definition</dd> <dt>Next term</dt> <dd>Definition</dd> </dl>Tables
<table border="1"> <tr> <th>someheader</th> <th>someheader</th> </tr> <tr> <td>sometext</td> <td>sometext</td> </tr> </table>Frames
<frameset cols="25%,75%"> <frame src="page1.htm"> <frame src="page2.htm"> </frameset>Forms
<form action="http://www.example.com/test.asp" method="post/get"> <input type="text" name="lastname" value="Nixon" size="30" maxlength="50"> <input type="password"> <input type="checkbox" checked="checked"> <input type="radio" checked="checked"> <input type="submit"> <input type="reset"> <input type="hidden"> <select> <option>Apples <option selected>Bananas <option>Cherries </select> <textarea name="Comment" rows="60" cols="20"></textarea> </form>Entities
< is the same as < > is the same as > © is the same as ©Other Elements
<!-- This is a comment --> <blockquote> Text quoted from some source. </blockquote> <address> Address 1<br> Address 2<br> City<br> </address>