Вкладки
Компонент Вкладки позволяет группировать информацию при создании интерфейсов. В нем можно размещать другие компоненты (колонки, панели, текст и т. д.) и свойства. Вкладки можно добавлять внутрь других компонентов.
Когда вы добавляете этот компонент, он содержит одну вкладку. Чтобы добавить новые вкладки, нажмите на кнопку . Вы можете добавить обычную или динамическую вкладку.
Чтобы переключаться между вкладками, нажимайте на их названия.
Каждая добавленная вкладка — это отдельный элемент, который можно настроить.
Настройки обычной вкладки
Окно настроек обычной вкладки состоит из вкладок Основные, Дополнительные, События, Счетчик, Системные и Отображение.
Вкладка «Основные»
На этой вкладке можно задать основные настройки.
Скрыть — определение, при каких условиях вкладка будет отображаться или скрываться.
Используйте для этого функцию или формулу. Подробнее об этом можно прочитать в этой статье.
Только на чтение — определение, может ли пользователь редактировать данные на этой вкладке. Возможны следующие варианты:
— пользователь не может редактировать поля. Он сможет только просматривать введенные ранее данные.
— возможность редактировать поля наследуется от настроек родительской формы, страницы, портлета или компонента.
Если флажок не установлен, пользователь может заполнять поля, размещенные на этой вкладке.
Тип загрузки — способ загрузки вкладки на форме:
- Синхронная — пользователь увидит все данные на вкладке, когда загрузятся все элементы родительской формы, страницы, портлета или компонента;
- Ленивая — данные на вкладке загружаются после того, как отобразилась родительская форма, страница, портлет или компонент;
- При отображении — данные на вкладке отобразятся в тот момент, когда пользователь перейдет к ней.
Можно использовать этот способ, когда требуется отображать поля при определенных условиях.
Можно использовать этот способ, когда требуется отображать поля при определенных условиях.Заголовок — название вкладки, которое пользователь видит в интерфейсе.
Чтобы вкладка занимала все свободное пространство в интерфейсе, установите переключатель в поле Фиксированная высота в положение Да.
Вкладки «Дополнительные» и «События»
Вкладка «Счетчик»
Здесь можно настроить отображение счетчика на вкладке.
Текст — значение, который будет отображаться рядом с названием вкладки.
Отображать в виде точки — возможность отображать счетчик в виде точки. Чтобы задать условия, при которых счетчик будет отображаться в виде точки, воспользуйтесь функцией или формулой.
Цвет — выбор цвета счетчика: синий, красный, зеленый, желтый, темно-серый, серый.
Вкладки «Системные» и «Отображение»
Настройки на вкладках Системные и Отображение аналогичны настройкам компонента Колонка. Подробнее о них читайте в статье «Колонка».
Настройки динамической вкладки
Динамические вкладки позволяют отображать на вкладках информацию из объектов, списков из простых типов и структур обмена данными. Количество динамических вкладок соответствует количеству экземпляров объекта (записей справочника), экземпляров списка из простых типов или экземпляров структуры обмена данными. В каждую вкладку передается экземпляр из списка.
Чтобы начать работу с ними, нажмите на кнопку и выберите Добавить динамическую вкладку.
На верхней панели выберите компонент Динамическая вкладка и откройте его настройки. Подробнее о том, как перейти к настройкам, можно прочитать в этой статье.
Окно настроек динамической вкладки состоит из вкладок Основные, Дополнительные, События, Системные и Отображение.
Работа с ними схожа с настройками обычных вкладок.
Вкладка «Основные»
На вкладке Основные при работе с динамическими вкладками появляются дополнительные поля.
Источник данных — выбор свойства, данные которого используются для отображения на динамических вкладках. Вы можете выбрать свойство, в качестве типа данных которого указан объект или структура обмена данными (эти свойства должны быть с типом связи Список), или Список из простых типов.
Функция, срабатывающая при закрытии вкладки — возможность добавить функцию, которая определит действие при закрытии вкладки. Например, можно пересчитать значение на вкладке, отобразить уведомление и т. д.
Важно: в отличие от обычной вкладки, название динамической вкладки задается при помощи компонента Текст, который по умолчанию вложен в нее. Подробнее о работе с ним можно прочитать в статье «Текст».
Вкладки «Дополнительные», «События», «Системные» и «Отображение»
Работа с вкладками Дополнительные, События, Системные и Отображение осуществляется так же, как и при настройке обычных вкладок.
Настройки компонента «Вкладки»
Вы можете задать настройки для всех вкладок, добавленных на форму, страницу, портлет или в компонент.
Окно настроек компонента Вкладки состоит из вкладок Основные, Дополнительные, События, Системные и Отображение.
Вкладка «Основные»
На этой вкладке можно задать основные настройки компонента.
Так же, как и при настройке отдельных вкладок вы можете задать условия, при которых вкладки будут отображаться или скрываться в интерфейсе и определить, может ли пользователь редактировать данные на вкладках.
Контекстная переменная, отвечающая за активный элемент — выбор переменной типа Строка, в которой будет храниться вкладка, с которой пользователь работает в данный момент.
Вы можете перейти к созданию контекстной переменной в разделе Свойства, нажав на кнопку .
Действие при изменении активной вкладки — действие, которое будет происходить при переходе к другой вкладке.
Вкладки «Дополнительные», «События», «Системные» и «Отображение»
Работа с вкладками Дополнительные, События, Системные и Отображение осуществляется так же, как и при настройке обычных вкладок.
Введённые данные сохраняются в настройках автоматически. Если вам нужно отменить изменения, нажмите Отменить последние изменения. Воспользоваться этой кнопкой можно, только пока открыто окно настроек.
Чтобы применить настройки, сохраните форму или сохраните и опубликуйте страницу, портлет или пользовательский компонент при помощи кнопки .
dynamic-list.html menu-with-form.html
Нашли опечатку? Выделите текст, нажмите ctrl + enter и оповестите нас
Вкладки «Создание», «Просмотр», «Редактирование»
Перемещаясь между вкладками Создание, Просмотр, Редактирование, вы сможете добавить или изменить свойства приложения, расположить их в нужном порядке и настроить внешний вид каждой формы.
Вкладка «Создание»
На этой вкладке вы определяете, каким образом будет выглядеть форма карточки создания элемента приложения.
Чтобы настроить форму:
- Перетаскивайте свойства из столбца Контекст в столбец Название на форме. Каждое свойство в столбце Название на форме — это поле, которое пользователи должны будут заполнить при создании нового элемента приложения.
- Измените порядок расположения свойств методом drag-and-drop.
- Выберите обязательные для заполнения на форме поля, отметив их значком . Укажите свойства, доступные только для чтения — значок .
- Чтобы создать новое свойство, нажмите кнопку + Добавить. Добавленное свойство появится в столбце Контекст, а также на вкладке Контекст.
Настройки отображения свойства
Вы можете изменить настройки отображения свойства на форме, а именно отредактировать название на форме и текст подсказки, управлять обязательностью заполнения полей.
Для этого нажмите на свойство в столбце Название на форме и измените параметры в открывшемся окне.
Вкладка Общие настройки содержит следующие поля:
- Свойство — значение устанавливается автоматически и зависит от названия, указанного в поле Отображаемое имя при создании свойства приложения;
- Название на форме* — название свойства, которое пользователь увидит на форме. При необходимости название на форме можно отредактировать;
- Подсказка — дополнительная информация, поясняющая каким образом можно заполнить поле на форме создания;
- Обязательно для заполнения — при выборе опции поле станет обязательным для заполнения на форме;
- Только для чтения — при выборе опции пользователи не смогут редактировать это поле на форме создания элемента приложения;
- Скрывать, если не заполнено — этот флажок доступен для полей, отмеченных опцией Только для чтения. Если такое поле не было заполнено, то на форме оно отображаться не будет.
Если на форме есть поле типа Приложение:
- чтобы пользователь мог создать элемент связанного приложения, включите опцию Только для чтения. Тогда на форме отобразится значок плюса. На вкладке Свойства вы можете задать поля, которые увидит пользователь на форме после того, как создаст элемент;
- чтобы дать возможность выбрать элемент в этом поле, выключите опцию Только для чтения. Для удобства можно сузить выборку, настроив поиск элемента по его параметрам. Для этого перейдите на появившуюся вкладку Добавление элемента и включите опцию Выбор из списка. Затем нажмите Настроить колонки списка и задайте настройки таблицы так же, как на странице любого приложения. Например, для поиска договора добавьте параметр Контрагент. Нажав в поле Договор значок лупы, пользователь увидит форму поиска по параметрам, в которой отобразится столбец Контрагент. Дополнительно к выбору элемента можно настроить кнопку создания элемента. Подробнее об этом читайте в статье «Создание элементов приложения на карточке другого приложения».
После того как настройка формы создания завершена, нажмите кнопку Сохранить в правом верхнем углу страницы.
Также вы можете скрыть название полей на форме и отображать только их содержимое. Данная настройка осуществляется в дизайнере интерфейсов при редактировании шаблона формы. Подробнее об этом читайте в статье «Шаблон формы».
Вкладка «Просмотр»
На данной вкладке настраивается форма просмотра элемента приложения.
Настройка формы просмотра выполняется так же, как настройка формы создания. При просмотре элемента приложения пользователи не могут изменять значения полей, поэтому на этой форме не предусмотрена настройка обязательности заполнения полей.
Нажав на название свойства, вы сможете изменить некоторые его параметры. Например, отредактировать имя на форме или добавить текст подсказки.
У свойств типа Приложение есть дополнительная вкладка Свойства. На ней отображается контекст (свойства) данного приложения.
Например, для приложения Юридическое лицо отображаются все реквизиты, заполняемые в отдельных полях: Полное наименование, Юридический адрес, Директор и т. д.
Их можно добавить на настраиваемую форму просмотра.
По окончании настройки формы просмотра нажмите кнопку Сохранить в правом верхнем углу окна.
Вкладка «Редактирование»
На данной вкладке настраивается форма редактирования элемента приложения.
Настройка формы редактирования выполняется так же, как настройка формы создания.
360028941112.html mass-edit-tab.html
Была ли статья полезной?ДаНетВыберите вариантРекомендации не помоглиТекст трудно понятьНет ответа на мой вопросСодержание статьи не соответствует заголовкуДругая причинаДавайте поговорим о нативных HTML-вкладках
В течение прошлого года я был в команде людей внутри Open UI, занимающихся выяснением того, как получить нативный, доступный элемент в HTML.
Мы команда людей с разным опытом; авторы спецификаций, поставщики браузеров, разработчики и нормальные практики, такие как я. Open UI — это группа сообщества, поэтому технически мы не можем сделать HTML (по юридическим причинам), но мы можем представить исследование рабочим группам W3C. Я рассматриваю Open UI как специальное исследовательское подразделение W3C с особым опытом в области систем проектирования и общих веб-компонентов.
« Tabvengers », как мы известны, подготовили несколько исследовательских документов и экспериментов:
- Исследования, документирующие множество общих частей и особенностей табулатур; перечень интерфейсов в матрице систем проектирования и реализаций
- Исследования, документирующие распространенные шаблоны разметки для вкладок; сильно варьируется от 5-элементных, 4-элементных, 3-элементных, 2-элементных и 1-элементных решений
- Пользовательский элемент, заключенный в веб-компонент; экспериментальный прототип и начало обсуждения
Наше исследование показало, что существует множество вариантов элементов управления вкладками.
Существует также множество вариаций шаблонов разметки. Существуют варианты, написанные для операционных систем, видеоигр, jQuery, компонентов React и веб-компонентов. Но мы думаем, что немного вскипятили этот океан и пришли к приличному консенсусу о том, что может быть хорошим элементом … и это не !!!
Я попытаюсь обобщить эту краткую историю, но я сделал для вас версию мема с галактическим мозгом, если это слишком длинно и читать скучно.
По мере того, как мы анализировали проблему и рассматривали точки зрения на доступность и отзывчивый дизайн, мы начали коллективно чувствовать, что HTML может потребоваться решение, которое представляет собой нечто большее, чем отображение 1:1 того, что указано в руководстве по практике разработки ARIA. Это приведет вас к тому, что у вас будет один элемент на роль ARIA. Что неплохо, пока вы не рассмотрите некоторые приложения реального мира.
С точки зрения доступности по одному семантически ничем не отличается от <вкладки> управление.
Они оба представляют один раздел контента за раз (даже доступные привязки клавиатуры одинаковы). На самом деле, с точки зрения адаптивного дизайна, переключение между вкладками и аккордеоном в разных окнах просмотра является распространенным шаблоном. Часто вам нужна не сворачивающаяся, естественно плавная трубка контента, а затем вы соглашаетесь на вкладки, когда место доступно. Итак… что, если бы один элемент мог решить все эти проблемы сразу?
Существует не так много существующих HTML-элементов, которые можно преобразовать в другой элемент. Нам нужен был язык для описания концепции, и мы сошлись на идее, которую Брайан Карделл назвал «возможностями дизайна». «Предоставление возможностей» — это уникальное звуковое и визуальное представление фрагмента контента. И одно и то же содержание может проявляться в разных аффордансах. я сравниваю с в некоторой степени, изменение типа ввода иногда меняет визуальное и слуховое восприятие ввода, но функционально это выполняет ту же работу: сбор ввода.
Другим примером может быть скромная полоса прокрутки, в HTML нет элемента , мы используем CSS, чтобы предложить этот контроль или доступность.
Для дальнейшего тестирования этой идеи аффордансов мы перешли к этапу прототипирования и создали веб-компонент, который назвали 9.0003 <острые разделы> .
Встречайте
<острые разделы> См. перо острые разделы Брайана Карделла (@bkardell) на КодПене.
- Посмотреть на Github
- Форк на CodePen
Spicy Sections — это наша попытка поэкспериментировать с этой идеей дизайнерских возможностей. Суть идеи в том, что вокруг разделов контента есть элемент-оболочка. Мы начинаем с обычного тюбика контента с структурированная разметка. Содержимое внутри постепенно улучшается до чего-то интерактивного. Заголовки корневого уровня преобразуются во вкладки, а содержимое между заголовками помещается в панели вкладок.
<острые разделы>Мой крутой раздел
Содержимое вкладки находится здесьДругой мой сворачиваемый раздел
Дополнительные материалы здесь
Затем в CSS вы определяете, какие возможности использовать и где:
острые разделы {
--const-mq-возможности:
[экран и (макс. ширина: 40em)] свернуть |
[экран и (минимальная ширина: 60em)] панель вкладок
;
}
Этот синтаксис не является окончательным, но, надеюсь, вы видите, как медиазапрос (или контейнерный запрос?) может определять доступность. При значении менее 40em контент схлопывается в аккордеон контента. При размере более 60em содержимое представляется в виде вкладок. Между 40em и 60em вы должны увидеть нормальный структурированный контент.
Вы можете стилизовать такие части, как панель вкладок , используя Shadow Parts.
Это может сбивать с толку, если вы впервые обращаетесь к стилю веб-компонента, но я обнаружил, что он довольно универсален.
В целях эксперимента я вырезал «острую» версию своей книжной полки, которая каждый год складывается в отдельную панель вкладок. В мобильной версии годы складываются в аккордеон. Вы можете просмотреть исходный код и понять, как работают разметка и стили.
Посмотреть мою пряную книжную полку
Примечание к структуре оглавления
Многие решения для вкладок используют разметку в стиле «оглавления»:
Вкладка 1 Вкладка 2 Вкладка 3 это панель это панель это панель
Это допустимый подход, и на самом деле именно его рекомендует руководство ARIA Authoring Practices, и это тот же подход, который использовали исторически популярные библиотеки, такие как jQuery UI. На практике есть пара проблем.
С точки зрения прогрессивного улучшения, если JavaScript не удалось смонтировать или старый браузер попытался его отобразить, три 9Элементы 0003 tab вернутся к диапазонам, которые ничего не делают. У них не будет контекста, и панель контента потеряет свою маркировку. Также трудно извлечь другие возможности из этой разметки. По сути, вам придется перепроектировать намерение и уровни заголовков, чтобы предложить трубку контента или свернуть с уровнями заголовков. Этот шаблон разметки работает, если вы делаете только вкладок.
Некоторые преимущества одноэлементного подхода
С помощью одного HTML мы можем решить двух зайцев одним выстрелом. Мы получаем аккордеон и элемент управления вкладками из одного и того же элемента. На самом деле мы можем использовать один элемент и иметь бесконечные аффордансы. Мы также получаем убийственную историю прогрессивного улучшения. И определить один элемент проще, чем пять? Я на самом деле не знаю, правда ли это.
Как ни странно, этот подход не слишком отличается от идеи Яна Хиксона из 2004 года.
Я не могу поверить, что мы провели последние 17 лет без нативных вкладок HTML, проклиная небо, подводя наших пользователей и заново изобретая колесо. Но, увы, пришло время это исправить.
Дэйв, Дэйв, это не решает мою странную потребность, когда ты нажимаешь на предпоследнюю вкладку, и она звонит моей бабушке.
Поздравляем, вам больше не нужно создавать собственные настраиваемые элементы управления вкладками!
На самом деле, я не хочу быть пренебрежительным, но бывают ситуации, когда стандартное или универсальное решение для вкладок не соответствует вашим потребностям. Мы надеемся, что сможем создать строительный блок, который поможет вам, или Google Docs, или кому-то еще. Но если какая-то важная функция отсутствует, сообщите нам об этом.
Что дальше для Табвенгеров?
Следующим шагом будет официальное предложение в Open UI, который, как мы надеемся, подпишет идею, а затем в рабочие группы HTML, CSS и ARIA. Но прежде чем мы это сделаем, нам нужно…
- Тест с реальными пользователями — Это значит ты! Но я также обратился к друзьям из Техасской школы для слепых и слабовидящих (TSBVI) с просьбой помочь в проведении специального контроля качества. Надеюсь, мы сможем двигаться вперед с уверенностью в том, что это отвечает потребностям людей, а в случае с TSBVI это часто люди со сложной инвалидностью.
- Получить отзывы разработчиков — Мы получили положительные отзывы от браузеров, и это обнадеживает, когда кто-то, кто работает в браузере, почти не возражает… но мы хотели бы получать больше отзывов разработчиков. Не стесняйтесь экспериментировать с Spicy Sections и дайте нам знать, как это можно улучшить. Если вы используете его где-то, дайте нам знать, мы хотели бы отслеживать это.
- Именование — Имя не является окончательным. Они отклонили мое предложение
MightyMorphinElement. - Карусели? — Я считаю положительным сигналом то, что группа ARIA обсуждала новый
role="carousel", и сотрудники Apple рекомендовали отложить решение проблемы до Open UI, которую подхватили табвенгеры. Карусели… уххх, но, может быть, есть шанс сделать хорошую, чтобы нам не приходилось засорять интернет плохими. 🤷♂️
Надеюсь, мы сможем двигаться вперед с уверенностью в том, что это отвечает потребностям людей, а в случае с TSBVI это часто люди со сложной инвалидностью.
Я думаю, что мы все на 100% сосредоточены на разработке хорошего, надежного решения, прежде чем привязываться к имени. Если вы дошли до этого места, спасибо за чтение! Если это доберется до браузера, это будет замечательно. Кто знает. Но я точно знаю, что СЕЙЧАС настало время для обратной связи. полезно? Если мы переименуем его в и добавим в браузер завтра, удовлетворит ли он ваши потребности? Не могли бы вы использовать его в своих проектах? Вы используете его в настоящее время? Есть ли стилистические пробелы? Пожалуйста, сообщите нам либо на GitHub, либо о том, что мои личные сообщения открыты.
Спасибо Брайану Карделлу за рецензирование черновика этого поста.
Пример вкладок с автоматической активацией | ПНГ | ВАИ
Пример вкладок с автоматической активациейКод в этом примере не предназначен для производственных сред. Прежде чем использовать его для каких-либо целей, прочитайте это, чтобы понять, почему.
Это наглядный пример одного из способов использования ARIA, соответствующего спецификации ARIA.
- В некоторых случаях могут быть пробелы в поддержке. комбинации браузера и вспомогательных технологий, особенно для мобильные/сенсорные устройства. Тестирование кода, основанного на этом примере, со вспомогательными технологиями необходимо, прежде чем рассматривать возможность использования в производственных системах.
- Проект ARIA и Assistive Technologies разрабатывает измерения поддержки вспомогательных технологий для примеров APG.
- Надежная доступность может быть дополнительно оптимизирована путем выбора шаблонов реализации, максимально использующих семантический HTML, и принимая во внимание предупреждение о том, что Нет ARIA лучше, чем Bad ARIA.
Об этом примере
В этом разделе примеров демонстрируется виджет вкладок, который реализует шаблон вкладок. В этом примере вкладка автоматически активируется, и связанная с ней панель отображается, когда вкладка получает фокус. Авторам рекомендуется рассмотреть возможность автоматической активации вкладок только в случаях, когда панели могут отображаться мгновенно, т. е. все содержимое панели присутствует в DOM. Дополнительные рекомендации см. в разделе «Принятие решения о том, когда сделать выделение автоматически следующим за фокусом».
Аналогичные примеры включают:
- Пример вкладок с ручной активацией: виджет вкладок, в котором пользователи активируют вкладку и отображают ее панель, нажимая Пробел или Введите .
Датские композиторы
Мария Терезия Алефельдт (16 января 1755 — 20 декабря 1810) была датским (первоначально немецким) композитором. Она известна как первая женщина-композитор в Дании. Мария Терезия написала музыку к нескольким балетам, операм и спектаклям королевского театра. Она получила хорошую критику как композитор и была описана как «virkelig Tonekunstnerinde» («Настоящий музыкальный исполнитель»).
Карл Иоахим Андерсен (29апрель 1847 — 7 мая 1909) — датский флейтист, дирижёр и композитор, родившийся в Копенгагене, сын флейтиста Кристиана Иоахима Андерсена. И как виртуоз, и как композитор флейтовой музыки он считается одним из лучших в свое время. Он считался жестким руководителем и учителем и поэтому многого требовал от своих оркестров, но благодаря этому стилю достиг высокого уровня.
Ида Генриетта да Фонсека (27 июля 1802 — 6 июля 1858) — датская оперная певица и композитор.
Ида Генриетта да Фонсека была дочерью Авраама да Фонсека (1776–1849).) и Мари Софи Кирскоу (1784–1863).
Она и ее сестра Эмили да Фонсека были ученицами Джузеппе Сибони, хормейстера Оперы в Копенгагене.
Ей дали место в Королевской опере вместе с сестрой в том же году, когда она дебютировала в 1827 году.
Peter Erasmus Lange-Müller; 1 декабря 1850 — 26 февраля 1926) — датский композитор и пианист. На его композиционный стиль повлияла датская народная музыка и творчество Роберта Шумана; Иоганнес Брамс; и его датские соотечественники, в том числе J.P.E. Хартманн.
Специальные возможности
- Чтобы облегчить пользователям программ чтения с экрана переход от вкладки к началу содержимого в активной
tabpanel, элементtabpanelимеетtabindex="0"для включения панели в последовательность Tab страницы. Рекомендуется, чтобы все элементы tabpanelв наборе вкладок были доступны для фокусировки, если в наборе есть какие-либо панели, содержащие содержимое, где первый элемент в панели не является фокусируемым. - Чтобы люди, которые полагаются на настройки высокой контрастности браузера или операционной системы, могли отличить активную (выбранную) вкладку от других вкладок и воспринимать фокус клавиатуры:
- Активная вкладка имеет границу в 2 пикселя слева и справа и границу в 4 пикселя сверху, а имена неактивных вкладок имеют границу в 1 пиксель. Активная вкладка также на 4 пикселя выше, чем неактивные вкладки.
- Кольцо фокуса рисуется с границей CSS на дочернем элементе
spanэлемента вкладки. Этот диапазон фокуса отделен от границы вкладки на 2 пикселя, чтобы фокус и выбор были видны отдельно. Обратите внимание, что когда элемент вкладки находится в фокусе, контур самого элемента вкладки устанавливается равным 0, поэтому отображается только одно кольцо фокусировки. - Поскольку прозрачные границы видны на некоторых системах, когда включены настройки высокой контрастности, только сфокусированные
элемент spanимеет видимую границу. Когда элементыspanне указывают на фокус, они имеют рамку шириной 0 и дополнительное отступы, равные по ширине границе, которая используется для указания фокуса.
- Чтобы содержимое вкладки оставалось видимым при увеличении экрана, ширина вкладок и панелей вкладок определяется в процентах от ширины экрана. По мере увеличения страницы высота вкладки увеличивается, а содержимое вкладки перетекает в новые размеры вкладки.
Рекомендуется, чтобы все элементы 
Обратите внимание, что когда элемент вкладки находится в фокусе, контур самого элемента вкладки устанавливается равным 0, поэтому отображается только одно кольцо фокусировки.Подставка для клавиатуры
| Ключ | Функция |
|---|---|
| Вкладка |
|
| Стрелка вправо |
|
| Стрелка влево |
|
| Дом | Перемещает фокус на первую вкладку и активирует ее. |
| Конец | Перемещает фокус на последнюю вкладку и активирует ее. |
Роль, свойство, состояние и атрибуты Tabindex
| Роль | Атрибут | Элемент | Использование |
|---|---|---|---|
табличный список | раздел | Указывает, что элемент служит контейнером для набора вкладок. | |
ария-labeledby="ID_REFERENCE" | раздел | Предоставляет метку, описывающую назначение набора вкладок. | |
вкладка | кнопка |
| |
выбранная ария = "истина" | кнопка |
| |
выбранная ария = «ложь» | кнопка |
| |
табиндекс="-1" | кнопка |
| |
ария-элементы управления = "ID_REFERENCE" | кнопка | Относится к элементу с role=tabpanel , связанному с вкладкой. | |
вкладка | раздел |
| |
ария-labeledby="ID_REFERENCE" | раздел |
| |
табиндекс="0" | раздел |
