Может ли метка ссылаться только на элементы ввода?

W3Schools говорят об ярлыках:

Тег <label> определяет метку для элемента input. [Акцент мой]

Означает ли это, что следующий HTML-код недействителен?

<html>
    <body>
        <label for="x">Label</label> 
        <hr>
        <div id="q" contentEditable="true">Hello</div>
        <hr>
        <div id="x" contentEditable="true">World</div>
    </body>
</html>

Как Chrome, так и IE8 фокусируются на World при нажатии Label, Firefox не делает этого. Что правильно?

Ответ 1

В соответствии с W3C он применяется к элементам управления формы, а элементы управления формой определяется как:

  • Кнопки
  • Флажки
  • Радио кнопки
  • Меню
  • Текстовый ввод
  • Выбор файла
  • Скрытые элементы управления
  • Теги объектов

Итак, FireFox технически прав, хотя я вряд ли буду считать его "ломающимся", если браузер не ограничит его этими элементами.

Ответ 2

Спецификация HTML говорит о атрибуте label "для", когда присутствует, значение этого атрибута должно быть таким же, как значение атрибута id какого-либо другого элемента управления в том же документе. метка, связанная с содержимым элемента. "

Таким образом, ссылки id в "for" должны соответствовать идентификатору элемента управления. Какой контроль? Спецификация в основном говорит, что любой input является элементом управления, как и button, select или object. Таким образом, Firefox технически прав - a div не является элементом управления.

Ответ 3

Я бы сказал, что это неправильное использование разметки, потому что семантика семерок состоит в том, что они специально предназначены для элементов управления.

Элемент LABEL используется для указания метки для элементов управления, которые не имеют неявные метки,

http://www.w3.org/TR/html401/interact/forms.html#h-17.9.1