WAI-ARIAを使用している要素を強調して表示します。
WAI-ARIAを使用している要素 by mlca11y
Details
Authormlca11y
LicenseNo License
Categoryglobal
Created
Updated
Code size2.3 kB
Code checksumd987df23
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
使い方
- ページのスタイルを無効にします
- Web Developerなどを利用します
- 本ユーザースタイルを有効化します
- 本ユーザースタイルによる強調表示内容を目視で確認します
制限事項
- ページやコンテンツによっては表示が崩れる場合があります
- 強調表示される要素・属性がすべて問題となるわけではありません
- 複数のルールに該当する要素では表示される内容が制限されます
- たとえばscope属性とlang属性がth要素に指定されている場合はscope属性のみが強調表示されます
Source code
/* ==UserStyle==
@name WAI-ARIAを使用している要素
@namespace mlca11y
@version 1.0.0
@description WAI-ARIAを使用している要素を強調して表示します。
@author mlca11y
==/UserStyle== */
@-moz-document url-prefix("http:"), url-prefix("https:"), url-prefix("file:") {
:root {
--outline-font: "Consolas", monospace;
--outline-color-normal: hsl(60, 75%, 33%);
--outline-color-01: hsl(0, 75%, 33%);
--outline-color-02: hsl(120, 75%, 33%);
--outline-color-03: hsl(180, 75%, 33%);
--outline-color-04: hsl(240, 75%, 33%);
--outline-color-05: hsl(300, 75%, 33%);
--outline-width-error: 7px;
--outline-width-warning: 5px;
--outline-width-info: 3px;
--outline-width-normal: 1px;
--outline-style-usecss: dashed;
--outline-style-aria: dotted;
--outline-style-normal: solid;
}
/* WAI-ARIAを使用している要素 */
/* ARIA attributes */
[aria-activedescendant],
[aria-atomic],
[aria-autocomplete],
[aria-busy],
[aria-checked],
[aria-colcount],
[aria-colindex],
[aria-colspan],
[aria-controls],
[aria-current],
[aria-describedby],
[aria-details],
[aria-disabled],
[aria-dropeffect],
[aria-errormessage],
[aria-expanded],
[aria-flowto],
[aria-grabbed],
[aria-haspopup],
[aria-hidden],
[aria-invalid],
[aria-keyshortcuts],
[aria-label],
[aria-labelledby],
[aria-level],
[aria-live],
[aria-modal],
[aria-multiline],
[aria-multiselectable],
[aria-orientation],
[aria-owns],
[aria-placeholder],
[aria-posinset],
[aria-pressed],
[aria-readonly],
[aria-relevant],
[aria-required],
[aria-roledescription],
[aria-rowcount],
[aria-rowindex],
[aria-rowspan],
[aria-selected],
[aria-setsize],
[aria-sort],
[aria-valuemax],
[aria-valuemin],
[aria-valuenow],
[aria-valuetext],
[role] {
outline-color: var(--outline-color-normal);
outline-width: var(--outline-width-error) !important;
outline-style: var(--outline-style-aria) !important;
outline-offset: -2px !important;
}
}