span (элемент HTML)

Описание

Для элемента, который не содержит семантической информации о содержимом внутри, а также не содержит изменений в стиле или каких-либо других визуальных изменений, о которых стоит упомянуть, элемент с низким диапазоном является одним из наиболее полезных элементов в вашей панели инструментов HTML.

Когда вы переносите текст с открывающим <span></span>class

В примере, показанном здесь, автор решил, что все названия брендов должны классифицироваться как «название бренда» и стилизоваться по-разному с помощью CSS, курсивом, прописными буквами, как показано на следующем рисунке.

Названия компаний в стиле элементов span

Интервал является встроенным элементом и должен содержать только текстовое содержимое или вложенные встроенные элементы или элементы фразы. Его не следует использовать для окружения элементов уровня блока — такое часто встречается в системах управления контентом, которые пытаются применить стилизацию практически к любому элементу, разбрасывая его вокруг.

Диапазон span тесно связан с элементом div, который является универсальным контейнером уровня блока, в отличие от span, который является встроенным универсальным контейнером.

Предостережение: нередко люди сходят с ума от пролетов, используя их повсюду. Спантис — это плохая практика — это так же плохо, как доза дивизии. Убедитесь, что вы правильно используете элемент span. Например, если вы обнаружите, что применяете пролеты, как это, у вас проблемы:

  Он сказал, что это <span class = "важный"> действительно </ span> важно
     знать разницу. 

Понятно, что в приведенном выше примере элемент em был бы более уместным, поскольку он подразумевает акцент во всех браузерах. С другой стороны, без стилевого оформления CSS было бы практически бессмысленно.

пример

Вот пример использования элемента span
цели:

  .brandname {font-style: italic; цвет: # 006; преобразование текста: прописные буквы;}

 ⋮
 <p> На выставке были представлены различные бренды.
     конференция, включая <span class = "brandname"> Adobe </ span> ,
     <span class = "brandname"> Microsoft </ span> , <span 
      class = "brandname"> Apple </ span> и <span 
      class = "brandname"> Intel </ span> . </ p>