在 Tab 键顺序中插入元素
使用 tabindex="0"
将元素插入自然 Tab 键顺序。例如:
<div tabindex="0">Focus me with the TAB key</div>
如需聚焦某个元素,请按 Tab
键或调用该元素的 focus()
方法。
从标签页顺序中移除元素
使用 tabindex="-1"
移除元素。例如:
<button tabindex="-1">Can't reach me with the TAB key!</button>
这会从自然 Tab 键顺序中移除某个元素,但仍可通过调用其 focus()
方法聚焦该元素。
请注意,对某个元素应用 tabindex="-1"
不会影响其子项;如果这些子项自然按 Tab 键顺序排列,或由于存在 tabindex
值,这些子项将保持 Tab 键顺序不变。如需从 Tab 键顺序中移除某个元素及其所有子级,请考虑使用 WICG 的 inert
polyfill。polyfill 会模拟所提议的 inert
属性的行为,该属性会阻止辅助技术选择或读取元素。
让一切动起来!
.loader {
animation: spin 0.75s infinite steps(var(--count));
}
@keyframes spin {
to {
transform: rotate(360deg);
}
}
请注意使用 steps(var(--count))
以获得理想的效果 ✨