在我的项目中，我有一个“结果项”列表，可以收藏，然后它们出现在页面一侧的收藏夹列中。为了让键盘用户更容易访问，我创建了一个隐藏的cta，允许他们直接跳到他们最喜欢的项目，而不必先通过所有结果项目的标签。我只想让这个cta在被分页时可见。我的理解是:focus-visible可以实现这一点。但是，由于某种原因，它对我不起作用。我的HTML和CSS看起来像：第一个谁能帮我找出我错在哪里？先谢了
:focus-visible
xienkqul1#
button元素是你要定位的对象，而不是包含它的div。不要定位div，而是定位button。另外，使用opacity，因为可见性似乎不适合tabindex。你也可以对button应用样式。第一个
tez616oj2#
根据我的经验（主要是在chrome上），带有display:none或visibility:hidden的元素不能通过鼠标或键盘聚焦。大多数实现都使用类似于下面的语句：第一个
display:none
visibility:hidden
jdgnovmf3#
一个小的注意是，你不需要添加tabindex到交互式元素在您的情况下按钮！
3条答案
按热度按时间xienkqul1#
button元素是你要定位的对象，而不是包含它的div。不要定位div，而是定位button。另外，使用opacity，因为可见性似乎不适合tabindex。你也可以对button应用样式。
第一个
tez616oj2#
根据我的经验（主要是在chrome上），带有
display:none或visibility:hidden的元素不能通过鼠标或键盘聚焦。大多数实现都使用类似于下面的语句：
第一个
jdgnovmf3#
一个小的注意是，你不需要添加tabindex到交互式元素在您的情况下按钮！