label - 使用占位符代替标签

Question

在可访问性方面，通常不使用占位符代替标签，因为在字段中输入内容后，占位符会消失。但是，如果我的占位符之后充当视觉标签怎么办？

在这种情况下只使用占位符代替实际标签是否仍然可以？如果是这样，我是否还需要用 aria-label 标记它？

Answer 1

我不建议使用placeholder属性或其他容器代替<label>元素。

正如您所描述的，这不是具有“视觉标签”的问题。该元素在数据级别以编程<label>方式与该元素相关联。<input>

<label for="middle-initial">Middle Initial</label>
<input id="middle-initial">

该placeholder属性对屏幕阅读器本质上是不可见的，因此它可以与 结合使用<label>，但不应用作 . 的替代品<label>。

如果您真的不喜欢<label>页面上的视觉外观，您可以使用 CSS 将文本置于屏幕之外，或者如果您当前正在使用引导程序，则可以使用.sr-only该类。