html中的label標籤使用方法

這次要介紹給大家的是html中的label標籤使用方法，我們都知道一個完整的表單是由表單標籤

先舉例：

[html] view plain copy
E-mail:  

表單控制項都是內嵌元素所以他兩個會在一行顯示。在網頁中當我們點擊E-mai字樣或文字方塊時都會在文字方塊中出現遊標，這就是label標籤的功能了。說白了label標籤就是他所關聯的表單控制項的延伸，即滑鼠點擊了他，就會出現和點擊他所關聯的表單控制項一樣的效果。而這前提是label的for屬性的屬性值與想要關聯的表單控制項的id一樣。

若不想用id和for關聯還可用第二種方法。

[html] view plain copy

E-mail:

效果是跟以前一樣的。

當然其他表單控制項也可以與label關聯。例如下面的例子：

[html] view plain copy
a: 
  
[html] view plain copy
b: 
  
[html] view plain copy
c: 
登入後複製

那你可能會說，這label標籤好想也沒多大用嘛。

嗯，當然有用。除了增強用戶體驗外，還為行動不便人士上網提供了便利。比如說，視力障礙者是藉助「網頁朗讀器」發出的聲音來瀏覽網頁的，若沒有label標籤的關聯，上網者就在腦海中不能想像出那種對應性，不能很好理解網站表單所想表達的內容。再例如，肢體有缺陷的上網者對於滑鼠的控制是很辛苦的，運用label後點擊的目標變大了，有利於操作。

So，一個真正的好的頁面既要能跨瀏覽器，還要能適配各種大小屏幕的設備，還應該對各類上網者（無論是老年人，還是有缺陷的人）提供便利。

html中的label標籤使用方法就這麼多，有需要的朋友可以保存一下，也請大家持續關注本站的其他更新。

相關閱讀：

HTML裡的命名規則

#怎麼隱藏溢出DIV邊框的內容

怎麼用CSS修改滑鼠樣式

以上是html中的label標籤使用方法的詳細內容。更多資訊請關注PHP中文網其他相關文章！