Возможно ли включить элементы html - например, img, span или div - в элемент метки?html в элементах ярлыков
На моей странице есть переключатели, позволяющие пользователям выбирать между различными макетами, и я бы хотел отображать визуальную метку, а не простой текст.
В HTML 4.01, то label элемент может содержать «элементы инлайн», который включает в себя img и span но исключает div. Это, однако, слишком разрешительно, и HTML5 PR говорит: «Фраза содержимого, но без надписей с надписью, если это не элемент управления с надписью, а не элементы-потомки label». Здесь «фразирование содержимого» во многом совпадает с «встроенными элементами».
С практической точки зрения безопаснее всего опускать все интерактивные материалы, такие как ссылки. Несмотря на то, что эффекты в принципе хорошо определены, плохой юзабилити имеет контент, который действует по-разному, например. так что нажатие на ссылку внутри метки приводит к тому, что ссылка будет следовать, щелкнув в другом месте метки, фокусируется на соответствующем поле формы (и, возможно, переключает ее настройку).
Но нет никакой проблемы с использованием изображений внутри метки, поскольку вложенность элементов идет. Для обеспечения доступности изображение должно содержать alt текст или. Остальная часть этикетки должна быть понятной даже тогда, когда изображение не видно. И вы можете использовать span, чтобы стилизовать часть ярлыка, отличную от остальных.
Да, вы можете использовать что-либо внутри метки.
В соответствии с https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label в элементе ярлыка допускаются теги содержимого контента. Этот список включает теги img и span, но не div. Полный список тегов контента фразировка, проверьте ссылку на Mozilla:
https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Content_categories#Phrasing_content
+1 Я отметил ответ Юкки как самый полный ответ, но ваш, безусловно, полезен! – Christophe
Спасибо, любая ссылка как ссылка и подтвердить поддержку браузера? – Christophe