HTML 的 role 屬性是什麼意思?

由於 HTML 本身的限制,有時 HTML 的標籤無法充份表示該元素的用途,比較常見的情況我們會將 a 標籤模擬成按鈕的樣式,在一般的情況下這沒什麼問題。但遇到需要更嚴謹的語意應用時(如無障礙網頁),我們就需要用特別的方式來區分,這時我們會藉由 role 來輔助說明該元素的用途,增強語義。

例如:你希望用 a 標籤自定義一組 button 的樣式,但又希望瀏覽器或螢幕閱讀器可以清楚了解這個 a 標籤是一個按鈕,這時你就可以使用 role 來完成上述的狀況。範例如下:

<a href="https://ossian.tw" role="button">歐森沃克</a>

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

返回頂端