<span> против <figure>против <area>

Question

Мне интересно, в чем разница между «span» и новыми тэгами HTML5 «figure» и «area».

Каково предназначение каждого из них и каковы соответствующие применения?Например, я часто использую 'span' с фоновым изображением, а не тег 'img', чтобы предотвратить выбор изображения;Каков наилучший элемент для достижения этой цели?

Answer 1

<span> - встроенный элемент, используемый по существу как встроенный элемент div. Это «универсальная оболочка для фразы, которая сама по себе ничего не представляет». ( W3C spec )

<figure> используется вместе с элементом <figcaption> для разметки чего-либо, что «может быть удалено из основного потока документа, не затрагивая его значение». ( W3C spec )

<area> предназначен для создания карт изображений и используется внутри элемента <map>.

В вашем случае я бы рекомендовал вместо этого использовать div или даже тег img с прозрачным png в качестве содержимого с фоновым изображением. Вы можете использовать тег img с user-select: none; вместо обычных префиксов, чтобы изображение не могло быть выбрано.

Answer 2

Тег <span> используется для текста или других встроенных элементов.В основном он используется для форматирования с использованием CSS.

Тег <figure> определяет содержимое потока, например изображения, диаграммы, фотографии, код и т. Д.

Тег <area> определяет область внутри карты изображений.