Перейти к основному содержанию

Обзор

VisuallyHidden отрисовывает визуально скрытый span. Его содержимое остаётся в дереве доступности и может предоставлять доступное имя. Он принимает нативные props span, ref span и композицию Base UI render. Импортируйте VisuallyHiddenProps из той же точки входа.

Использование

Используйте видимую метку, если позволяет пространство. Для элементов управления, которые уже принимают aria-label, этот атрибут является ещё одним способом задать доступное имя.

Скрытое содержимое

Разместите пояснительный текст внутри обёртки. Не размещайте внутри неё фокусируемые элементы управления: обёртка остаётся визуально скрытой, когда её дочерние элементы получают фокус. Она не добавляет live region, не удаляет содержимое из вспомогательных технологий и не скрывает конфиденциальные данные. Используйте id, чтобы связать скрытые описания с aria-describedby. Нативные атрибуты, className, style и ref применяются к скрытому элементу span или элементу, заданному через render. См. специальные возможности, чтобы узнать о шаблонах маркировки и объявлений.

Свойства

ReactNode
Content hidden visually while remaining available to assistive technology.
ReactElement<unknown, string | JSXElementConstructor<any>> | ComponentRenderFn<HTMLProps, {}>
Element or render function composed with the hidden span props and ref.