HTML打造極具親和力的表單_XHTML教程

      編輯Tag賺U幣
      教程Tag:暫無Tag,歡迎添加,賺取U幣!
      表單對于殘障人士來說是最不容易使用的東西。導(dǎo)航和成文的內(nèi)容是一種情況,而表單域和信息輸入的跳躍又是另一回事兒。因此,為表單增加更多元素,使得表單更易用和更具親和力未嘗不是一個是好注意。

      標(biāo)記

      每一個表單域都應(yīng)該有一個自己的標(biāo)記。label標(biāo)簽挑選出來,跟for屬性一起與一個表單元素關(guān)聯(lián)。

      示例代碼 [www.wf0088.com]
      <form>
      <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)到表單。

      分組與圖例說明

      你可以為表單域分組,比如名字(姓,名,頭銜等)或者地址(第一行,第二行,縣,地區(qū),郵編,國家等)。使用fieldset標(biāo)簽。
      在表單域的分組內(nèi),你可以使用legend標(biāo)簽產(chǎn)生圖例說明。
      注意:可視化瀏覽器傾向于用圍繞在表單組周圍的邊框來顯示,而圖例說明打破左上方的邊框而顯示。

      選項(xiàng)分組

      optgroup標(biāo)簽用于在一個層疊式選擇菜單為選項(xiàng)分類,label屬性是必須的,在可視化瀏覽器中,它的值將會是一個不可選的偽標(biāo)題,為下拉列表分組。

      示例代碼 [www.wf0088.com]
      <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>

      導(dǎo)航域

      像連接,表單域(和表單分組)需要為沒有指點(diǎn)設(shè)備(比如鼠標(biāo))的用戶導(dǎo)航。與連接相同的方法也可以用在表單元素上,使得任務(wù)更容易──tab逗留和快捷鍵。
      可以為input和legend等獨(dú)立表單標(biāo)簽設(shè)置accesskey和tabindex屬性。

      示例代碼 [www.wf0088.com]
      <input type="text" name="firstName" accesskey="f" tabindex="1" />

      來源:52CSS//所屬分類:XHTML教程/更新時間:2012-06-12
      相關(guān)XHTML教程