Overview of Button Examples
| Example | Source of Accessible Name | Roles | Accessible States and Properties | |||
|---|---|---|---|---|---|---|
| label | labelledby | child nodes | title | |||
| Button 1 (Text with CSS) |
X | application, button | aria-controls, aria-haspopup, aria-pressed | |||
| Button 2 (Inline images) |
X | application, button | aria-controls, aria-haspopup, aria-pressed | |||
| Example | Windows | Macintosh | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| IE 6 | IE 7 | IE 8 | FF 3.6+ | Safari 4+ | Opera 10+ | Chrome 5.0+ | High Contrast | FF 3.6+ | Safari 4+ | Opera 10+ | High Contrast | |
| Button 1 (text with CSS) |
X1 | X | X | X | X | X | X | X | X | X | X | X |
| Button 2 (Inline images) |
X | X | X | X | X | X | X | X | X | X | X | X |
1 -This example uses attribute selectors to apply aria state-related CSS. IE6 does not support role selectors
