Семантическое значение диапазона

https://stackoverflow.com/questions/278914

07-07-2019
|

Вопрос

Элемент span выглядит точно так же, как элемент div, но на уровне строки, а не на уровне блока.Однако я не могу придумать никакого полезного логического разделения, которое может обеспечить элемент span.

Отдельное предложение или слово, если оно не содержится в предложении, кажется наименьшей логической частью.Игнорирование CSS, поскольку CSS предназначен только для макета, а не для семантического значения, когда интервал обеспечивает дополнительную семантическую ценность, разбивая предложение или строку слов?

Кажется, что во всех случаях другие элементы лучше подходят для добавления семантической ценности, что делает диапазон просто элементом макета.Это правда?

Решение

Span может использоваться для добавления семантического значения, выходящего за рамки HTML. Это можно сделать с помощью классов, которые идентифицируют определенные атрибуты. Например, если вы пишете научно-фантастический роман, вы можете использовать span для идентификации выдуманных слов, потому что вы, возможно, захотите форматировать их по-другому, или потому что вы можете захотеть, чтобы программа проверки орфографии игнорировала их:

Затем мастер вызвал gravenwist и приказал атаковать приближающуюся армию. & Lt; span class = & Quot; волшебное слово & Quot; & Gt; gavenwist & Lt; / span & Gt; сопротивлялся, но wistwand был слишком силен.

Это можно сделать как

Затем волшебник вызвал могилу и приказал атаковать приближающуюся армию. gavenwist сопротивлялся, но wistwand мастера был слишком мощным.

Еще одним хорошим примером такого рода вещей являются микроформаты , которые позволяют создавать произвольную структуру в HTML:

<span class="tel">
 <span class="type">home</span>:
 <span class="value">+1.415.555.1212</span>
</span>

Преимущество span по сравнению с div состоит в том, что span могут появляться почти везде, потому что они являются встроенным содержимым, а div являются блочными элементами, поэтому они могут появляться только внутри некоторых других элементов.

Другие советы

Очень полезным преимуществом было бы отмечать изменения в языке. Например.

<p>Welcome to Audi UK, <span lang="de">Vorsprung durch Technik</span>.</p>

Программы чтения с экрана с несколькими языковыми возможностями могут использовать это.

Так что они не презентационные, а общие. На самом деле, интервалы редко представляются, если используется семантически значимое имя класса, например & Quot; spelling-error & Quot; а не " bold-red-text ".

<div class="name">
  <span class="firstname">John</span>
  <span class="lastname">Doe</span>
</div>

Это полностью зависит от того, что вы хотите выразить. Если разметка имени имеет для вас семантическую ценность (будь то просто ловушка для CSS для форматирования имен или извлечения их с использованием некоторого языка сценариев), тогда вы можете использовать span.

Я часто использую SPAN, когда хочу, чтобы JavaScript анализировал элемент и вставлял какое-то значение в тег, например:

<span datafield="firstname"></span>

Позже в него будет вставлено значение, поэтому в этом случае оно имеет значение, хотя только значение, которое я решу дать ему. В этом случае идеальным является тот факт, что span не влияет на макет.

span s может фактически быть носителем семантической информации в форме class атрибутов. Это используется микроформатами.

Тегам span нужен атрибут class или id, чтобы придать им смысл.

например0123 456789

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

Игнорирование CSS (и другой разметки, отличной от HTML), никогда. Единственная цель в жизни & Lt; span & Gt; состоит в том, чтобы иметь разметку, которую вы не можете выразить в HTML. Разметка, такая как & Lt; span style="dropCap" & Gt ;, которая не имеет эквивалента в HTML, но существует в печатных изданиях в течение сотен лет и которая всегда применяется только к одному символу - первой букве элемента (статьи, что угодно), не вызывая разрыв слова (или любой больший разрыв).

Кажется, что во всех случаях другие элементы лучше подходят для добавления семантическая ценность, делая пролет чисто элемент макета. Это правда?

Да и нет. Единственное реальное значение & Lt; p & Gt; в том, что это семантически нейтрально. То есть, в отличие, например, от & Lt; <=> & Gt ;, он не делает ничего такого, что вы могли бы захотеть, чтобы он не делал, когда вы используете его для переноса другой разметки. И бывают времена, например & Lt; <=> & Gt; выше, когда вы не хотите никаких других эффектов.

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

Я использую пролеты в моем EBNF - > Конвертер XHTML для применения другого формата к литералам и токенам.

Элементы

SPAN (и DIV) сами по себе обычно считаются семантически нейтральными. Хороший подход состоит в том, чтобы использовать семантическую разметку настолько, насколько это возможно, но иногда вы сталкиваетесь с ситуациями, когда существующие HTML-элементы, которые обеспечивают семантическое значение (EM, STRONG, ABBR, ACRONYM и т. Д., И т. Д.), Не подходят семантически. для вашего контента. Поэтому следующим шагом является использование семантически нейтрального SPAN или DIV с семантически значимым идентификатором или классом.

Я думаю, он спрашивает о разнице между div и span, и на самом деле его нет, кроме поведения по умолчанию.

Это вопрос соглашения. При использовании стилей div обычно используется для разграничения разделов контента, а span используется для разграничения встроенного текста. Вы также можете легко использовать <=> везде или <=> везде, но полезно думать о них как о других, даже если это только по соглашению.

В HTML можно использовать микроформаты. Но поскольку фактической спецификацией HTML является X HTML, в этом нет никакого смысла. Вместо:

<P>Hello, my name is <SPAN class="name"> Joe Sixpack </SPAN></P>

Я бы лучше использовал:

<P>Hello, my name is <FOAF:name> Joe Sixpack </FOAF:name></P>

Значение SPAN - это ", это (общий) диапазон (например, текста) содержимого " ;. Сравните с DIV, что означает & Quot; это логическое разделение (то есть общий раздел документа) & Quot;.

SPAN - это, в основном, ловушка для подвешивания стилей (поэтому вы можете использовать  вместо ).

Из спецификации

Элементы DIV и SPAN в сочетании с атрибутами id и class предлагают общий механизм для добавления структуры в документы. Эти элементы определяют контент как встроенный (SPAN) или блочный (DIV), но не навязывают контент другим формам представления. Таким образом, авторы могут использовать эти элементы в сочетании с таблицами стилей, атрибутом lang и т. Д., Чтобы адаптировать HTML к своим собственным потребностям и вкусам.

Предположим, например, что мы хотели сгенерировать HTML-документ на основе базы данных клиентской информации. Поскольку HTML не содержит элементов, которые идентифицируют такие объекты, как & Quot; client & Quot ;, & Quot; номер телефона & Quot ;, & Quot; адрес электронной почты & Quot; и т. Д. ., мы используем DIV и SPAN для достижения желаемых структурных и презентационных эффектов. Мы можем использовать элемент TABLE следующим образом для структурирования информации:

<!-- Example of data from the client database: -->
<!-- Name: Stephane Boyera, Tel: (212) 555-1212, Email: sb@foo.org -->

<DIV id="client-boyera" class="client">
<P><SPAN class="client-title">Client information:</SPAN>
<TABLE class="client-data">
<TR><TH>Last name:<TD>Boyera</TR>
<TR><TH>First name:<TD>Stephane</TR>
<TR><TH>Tel:<TD>(212) 555-1212</TR>
<TR><TH>Email:<TD>sb@foo.org</TR>
</TABLE>
</DIV>

<DIV id="client-lafon" class="client">
<P><SPAN class="client-title">Client information:</SPAN>
<TABLE class="client-data">
<TR><TH>Last name:<TD>Lafon</TR>
<TR><TH>First name:<TD>Yves</TR>
<TR><TH>Tel:<TD>(617) 555-1212</TR>
<TR><TH>Email:<TD>yves@coucou.com</TR>
</TABLE>
</DIV>

Лицензировано под: CC-BY-SA с атрибуция

Не связан с StackOverflow