Является ли тег <div> когда-либо нежелательной альтернативой тегу <p>?

StackOverflow https://stackoverflow.com/questions/907313

  •  05-09-2019
  •  | 
  •  

Вопрос

Я вижу <p> tag часто использовал в чужом коде, но никогда не использовал его в своей работе.

Мне интересно, какое преимущество это дает перед использованием <div> ярлык?

  1. Есть ли какие -либо преимущества, которые я мог бы получить от включения <p> пометить на мои страницы?

  2. Есть ли какой -либо недостаток только в использовании <div> теги без <p>?

Это было полезно?

Решение

DIV обозначает отдельный раздел на странице, семантически не связанный с остальными.С помощью тегов P вы указываете, что этот фрагмент текста разбит на абзацы, но остается единым целым.

ДОБАВЛЕН:Под «семантикой» люди обычно подразумевают возможность извлекать из HTML информацию о том, что представляют собой различные элементы страницы и как они связаны друг с другом, а не рассматривать весь HTML как просто разметку, которую нужно отобразить.Например, когда вы создаете меню, рекомендуется использовать для этой цели UL (неупорядоченный список), поскольку из разметки можно будет узнать, что все LI (элементы списка), содержащиеся в определенном списке, вероятно, означают варианты выбора тот же уровень.Я знаю, что для программ чтения с экрана для людей с ограниченными возможностями полезно попытаться сделать свою разметку как можно более семантически насыщенной.

Если вас это не беспокоит, то для визуализированного результата практически не имеет значения, используете ли вы DIV или Ps.Вы можете стилизовать оба варианта с помощью CSS, чтобы добиться одинакового внешнего вида.

Семантический HTML по-прежнему не является «абсолютным благом», к которому следует стремиться.Для многих людей семантика не имеет никакой ценности, поскольку они хотят, чтобы их страницы отображались правильно.Вот почему вечная дискуссия о том, следует ли использовать таблицы для разметки (и добавлять семантику там, где ее нет) или придерживаться CSS, не закончится в ближайшее время.

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

p означает «абзац», div означает «деление».Это настолько сложно, насколько это возможно.Это способ сообщить поисковым системам, парсерам, инструментам и т. д., что это абзац текста.

div нежелателен, когда вы фактически размечаете «абзац» текста.

Оба тега имеют разное назначение.

  • п Указывает абзац, обычно для организации контента (в основном текст и изображения)
  • div С другой стороны, прямоугольное пространство на холсте, обычно для целей макета.

Пример:Вы можете поместить панель навигации в элемент div, чтобы ее можно было легко перемещать слева направо по странице или переключаться на макет из трех столбцов.Различные разделы вашей навигации (сначала общая навигация по сайту, затем конкретные горячие ссылки на самую последнюю публикацию в блоге или что-то еще) можно разделить, поместив их в разные абзацы.

(Я знаю, плохой пример, потому что навигация лучше представлена ​​неупорядоченными списками, но какого черта).

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

Если вы помечаете контент, чтобы его можно было разместить с помощью CSS, вам, вероятно, понадобится <div>; <p> следует использовать для обозначения абзаца текста и все.

Помимо семантики (которая важна), вам также следует рассмотреть проблемы проверки.Согласно спецификации HTML4, вам не разрешено вкладывать другие элементы уровня блока (<div>, <ul>, другой <p>, и т. д.) внутри <p> без аннулирования вашего HTML.

Я видел ряд случаев, когда парсеры предпочитали преждевременно закрывать <p> чтобы разрешить начало другого вложенного блочного элемента.

Есть ли какие -либо преимущества, которые я мог бы получить от включения

пометить на мои страницы?

Да, при условии, что вы используете его правильно, потому что использование семантического HTML всегда полезно.

Есть ряд причин, почему это так, но основной из них для людей, которым нужно быстрое объяснение, является SEO.Поисковые системы лучше поймут вашу страницу, если вы используете семантический HTML.

Теги p предназначены для абзацев.Теги p часто содержат дополнительные стили CSS, относящиеся к текстовому содержимому, которое входит в них, и этот стиль можно определить в различных местах документации CSS.например, под буквой p обычно имеется немного дополнительного места.если вы попытаетесь разместить что-то с помощью тегов p, вы получите неравномерное заполнение.

Лучше использовать элементы div, если вы хотите иметь больший контроль над содержимым вашей страницы с программной точки зрения.Если придерживаться тегов div для решения всех проблем с макетом, вы также сможете использовать теги p исключительно для абзацев.

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