HTML高級(jí)教程親和力的表單_XHTML教程
教程Tag:暫無(wú)Tag,歡迎添加,賺取U幣!
表單對(duì)于殘障人士來(lái)說(shuō)是最不輕易使用的東西。導(dǎo)航和成文的內(nèi)容是一種情況,而表單域和信息輸入的跳躍又是另一回事兒。因此,為表單增加更多元素,使得表單更易用和更具親和力未嘗不是一個(gè)是好注重。
標(biāo)記
每一個(gè)表單域都應(yīng)該有一個(gè)自己的標(biāo)記。label標(biāo)簽挑選出來(lái),跟for屬性一起與一個(gè)表單元素關(guān)聯(lián)。
標(biāo)記為可視化瀏覽器處理本身使得標(biāo)記自己可點(diǎn)擊增加好處,使相關(guān)表單域獲得焦點(diǎn)。
注重:name和id兩者都是必須的──name為表單處理該表單域,id為標(biāo)記關(guān)聯(lián)到表單。
分組與圖例說(shuō)明
你可以為表單域分組,比如名字(姓,名,頭銜等)或者地址(第一行,第二行,縣,地區(qū),郵編,國(guó)家等)。使用fieldset標(biāo)簽。
在表單域的分組內(nèi),你可以使用legend標(biāo)簽產(chǎn)生圖例說(shuō)明。
注重:可視化瀏覽器傾向于用圍繞在表單組四周的邊框來(lái)顯示,而圖例說(shuō)明打破左上方的邊框而顯示。
選項(xiàng)分組
optgroup標(biāo)簽用于在一個(gè)層疊式選擇菜單為選項(xiàng)分類,label屬性是必須的,在可視化瀏覽器中,它的值將會(huì)是一個(gè)不可選的偽標(biāo)題,為下拉列表分組。
導(dǎo)航域
像連接,表單域(和表單分組)需要為沒(méi)有指點(diǎn)設(shè)備(比如鼠標(biāo))的用戶導(dǎo)航。與連接相同的方法也可以用在表單元素上,使得任務(wù)更輕易──tab逗留和快捷鍵。
可以為input和legend等獨(dú)立表單標(biāo)簽設(shè)置accesskey和tabindex屬性。
關(guān)于更多,請(qǐng)看親和力的連接。
標(biāo)記
每一個(gè)表單域都應(yīng)該有一個(gè)自己的標(biāo)記。label標(biāo)簽挑選出來(lái),跟for屬性一起與一個(gè)表單元素關(guān)聯(lián)。
示例代碼 [www.hl5o.cn]
<form>
<label for="yourName">Your Name</label>
<input type="text" name="yourName" id="yourName" /> ...
<label for="yourName">Your Name</label>
<input type="text" name="yourName" id="yourName" /> ...
標(biāo)記為可視化瀏覽器處理本身使得標(biāo)記自己可點(diǎn)擊增加好處,使相關(guān)表單域獲得焦點(diǎn)。
注重:name和id兩者都是必須的──name為表單處理該表單域,id為標(biāo)記關(guān)聯(lián)到表單。
分組與圖例說(shuō)明
你可以為表單域分組,比如名字(姓,名,頭銜等)或者地址(第一行,第二行,縣,地區(qū),郵編,國(guó)家等)。使用fieldset標(biāo)簽。
在表單域的分組內(nèi),你可以使用legend標(biāo)簽產(chǎn)生圖例說(shuō)明。
注重:可視化瀏覽器傾向于用圍繞在表單組四周的邊框來(lái)顯示,而圖例說(shuō)明打破左上方的邊框而顯示。
選項(xiàng)分組
optgroup標(biāo)簽用于在一個(gè)層疊式選擇菜單為選項(xiàng)分類,label屬性是必須的,在可視化瀏覽器中,它的值將會(huì)是一個(gè)不可選的偽標(biāo)題,為下拉列表分組。
示例代碼 [www.hl5o.cn]
<select name="country">
<optgroup label="Africa">
<option value="gam">Gambia</option>
<option value="mad">Madagascar</option>
<option value="nam">Namibia</option>
</optgroup>
<optgroup label="Europe">
<option value="fra">France</option>
<option value="rus">Russia</option>
<option value="uk">UK</option>
</optgroup>
<optgroup label="North America">
<option value="can">Canada</option>
<option value="mex">Mexico</option>
<option value="usa">USA</option>
</optgroup>
</select>
<optgroup label="Africa">
<option value="gam">Gambia</option>
<option value="mad">Madagascar</option>
<option value="nam">Namibia</option>
</optgroup>
<optgroup label="Europe">
<option value="fra">France</option>
<option value="rus">Russia</option>
<option value="uk">UK</option>
</optgroup>
<optgroup label="North America">
<option value="can">Canada</option>
<option value="mex">Mexico</option>
<option value="usa">USA</option>
</optgroup>
</select>
導(dǎo)航域
像連接,表單域(和表單分組)需要為沒(méi)有指點(diǎn)設(shè)備(比如鼠標(biāo))的用戶導(dǎo)航。與連接相同的方法也可以用在表單元素上,使得任務(wù)更輕易──tab逗留和快捷鍵。
可以為input和legend等獨(dú)立表單標(biāo)簽設(shè)置accesskey和tabindex屬性。
示例代碼 [www.hl5o.cn]
<input type="text" name="firstName" accesskey="f" tabindex="1" />
關(guān)于更多,請(qǐng)看親和力的連接。
相關(guān)XHTML教程:
- HTML5 INPUT placeholder及兼容性處理
- HTML表單里的Label標(biāo)簽
- 淺析HTML與javascript中常用編碼
- CSS網(wǎng)頁(yè)布局中必須要了解的幾個(gè)XHTML標(biāo)簽
- title和alt 標(biāo)簽介紹及其異同
- 淺析HTML標(biāo)簽strong和em的區(qū)別
- 說(shuō)說(shuō)XHTML中的alt屬性和title屬性
- Semantics語(yǔ)義是Html Xhtml是否真正符合標(biāo)準(zhǔn)的重要部分
- 九個(gè)W3C XHTML1.0及CSS標(biāo)準(zhǔn)認(rèn)證需要注意的問(wèn)題
- 請(qǐng)注意頁(yè)面head區(qū)域的編碼是不是規(guī)范
- HTML validate - 驗(yàn)證HTML代碼穿越多重瀏覽器標(biāo)準(zhǔn)
- XHTML具有語(yǔ)義的標(biāo)簽:有關(guān)H1位置的討論
XHTML教程Rss訂閱Div+Css教程搜索
XHTML教程推薦
- head區(qū)域的編碼規(guī)范
- Table布局中單元格background-color鼠標(biāo)響應(yīng)的JS代碼
- HTML初級(jí)教程標(biāo)題h1~h6
- Default style sheet - HTML4標(biāo)簽的默認(rèn)樣式列表
- A Link 鏈接的rel、target屬性詳解
- HTML表格標(biāo)記教程(7):背景顏色屬性BGCOLOR
- HTML表格標(biāo)記教程(32):單元格的水平對(duì)齊屬性ALIGN
- 揭開HTML 5工作草稿的神秘面紗
- HTML表格標(biāo)記教程(18):表格的表頭
- HTML中級(jí)教程元標(biāo)簽
- 相關(guān)鏈接:
- 教程說(shuō)明:
XHTML教程-HTML高級(jí)教程親和力的表單
。