Какова разница в рендеринге между тегом span и label?

Итак, я понимаю функциональную разницу между тегами span и label... однако, похоже, что существует также разница в рендеринге между тегами, и я не могу понять, что это такое? Кто-нибудь знает разницу рендеринга между диапазоном и меткой? Благодаря

Ответ 1

Помимо стилей рендеринга по умолчанию (ярлык иногда бывает полужирным шрифтом в некоторых браузерах), важным отличием является то, что метка, которую она должна связывать с полем формы (ввод, выбор и т.д.), чтобы маркировать то, что это поле. Следовательно, это атрибут "для". Его нельзя использовать ни для чего, кроме этого. Это особенно важно в отношении доступности с помощью экранных устройств, поскольку они ожидают, что эта ссылка будет существовать.

Span - это группа текста, к которой вы хотите применить аналогичный стиль. По умолчанию по умолчанию не применяется стиль.

PS: Пусть гнев Грейскулла найдет вас, если я когда-нибудь поймаю вас, используя вкладку с меткой, чтобы сделать текст полужирным или что-то в этом роде. Повторите за мной: "нет поля ввода, нет метки".

PPS: Извините, это одно из моих самых больших неприятностей с надписями других людей.

Ответ 2

Я не вижу различий в рендеринге со стандартными таблицами стилей в IE, Firefox, Opera или Chrome. Возможно, браузер может отобразить его по-другому, но вряд ли это будет существенной разницей.

Основное достоинство ярлыка состоит в том, что вы можете связать его с другим элементом управления формой (с помощью содержимого оболочки или атрибута for). Это может иметь преимущества доступности. Примечательно, что в типичном графическом браузере вы можете щелкнуть метку, чтобы сфокусировать связанный элемент управления (и отметьте его, для флажка/радиоприемника, что удобно, потому что в противном случае это довольно маленькая цель для удара). Это воспроизводит поведение виджета установленной формы ОС.