Подтвердить что ты не робот

Разница между DIV as-is и SPAN с дисплеем: block

Является ли <div/> отличным от <span style="display:block" /> каким-либо образом?

Они отображают только то же самое. Любая семантическая разница между двумя?

4b9b3361

Ответ 1

Да, они разные.

Даже если вы создаете пролет с display: block, вы все равно не можете помещать внутри него элементы уровня блока:

<div><p>correct</p></div>
<span style="display: block;"><p>wrong</p></span>

HTML (X) по-прежнему должен подчиняться (X) HTML DTD (независимо от того, как вы используете), независимо от того, как CSS меняет вещи.

Ответ 2

Здесь пример, где он делает реальную разницу (по крайней мере для действительного кода):

<a href='example.com'>
    <span class='title' style='display:block;'>The title of the image is also a link</span>
    <img src="example.com/someimage.jpg"/>
</a>

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

Атрибут div не будет вложен в тег a.

Ответ 3

A <div> является элементом уровня блока, который не имеет конкретной собственной семантики, помимо определения дискретного блока содержимого. A <span> является встроенным элементом, который не имеет собственной специфической семантики, помимо определения дискретного сегмента встроенного контента.

Вы можете использовать CSS для отображения диапазона в виде блока, но нет абсолютно никаких оснований для этого EDIT: кроме чисто визуальных эффектов, как демонстрирует Габриэль; я имею в виду, что вы не должны использовать CSS, чтобы попытаться принудить span к тому, чтобы иметь значение уровня блока с точки зрения структуры документа. Кроме того, если вы это сделаете, ваш контент, вероятно, окажется бессмысленным для пользователя без CSS, например слепого пользователя или поисковой системы.

Если это блок, используйте div. Если это часть встроенного контента, используйте диапазон. Помните, что CSS - это только презентация; ваша разметка по-прежнему должна быть структурирована логически, если ваш контент должен использоваться.

Подробнее см. http://www.w3.org/TR/html401/struct/global.html#edef-DIV.

Ответ 4

Да. Они могут содержать разные вещи и разрешены в разных местах.

Они также будут отображаться по-разному в средах, где CSS недоступен (например, в некоторых системах электронной почты)