Должен ли я помещать теги абзаца вокруг изображений?

У меня есть веб-страница, на которой есть текст с изображениями. Я пишу какой-то текст (в абзаце), затем помещаю изображение, затем еще один абзац.

Должен ли я также помещать теги p вокруг изображения или просто оставить его между ними только с тегом img?

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

<p></p>

между двумя изображениями, но я чувствую, что это неправильно :P


image html tags paragraph
person Adam    schedule 27.01.2010    source источник
comment
Вы можете попробовать опубликовать пример того, что вы получаете, и что вы хотите получить. Я не думаю, что совсем понял это из вашего описания.   -  person John    schedule 28.01.2010

Ответы (4)


arrow_upward
4
arrow_downward

Вы можете использовать CSS, чтобы изображения действовали как блоки, а не как встроенные блоки:

Поместите следующее в свой CSS где-нибудь:

img { display: block; }

Или, если у вас есть изображения, которые вы хотите отобразить встроенными, добавьте class="block" к вашим тегам img и измените CSS на это:

img.block { display: block; }
person pib    schedule 27.01.2010
comment
Хорошая идея. Всегда лучше использовать как можно меньше html-элементов. Если вы хотите, чтобы img действовал как элемент уровня блока, просто дайте ему display:block. - person Skilldrick; 28.01.2010

arrow_upward
2
arrow_downward

Стилизация изображения как блочного элемента является частичным решением. HTML должен быть спроектирован так, чтобы «работать» и без стилей. Если блочная модель требует, чтобы блочный элемент содержал только блочные или встроенные элементы, а не смешанные, то мы должны сделать это на самом низком возможном уровне. Вот почему меню создаются в виде списков, а не наборов ссылок. Это называется изящной деградацией.

Так что ИМХО тег ‹p› вокруг изображения должен быть добавлен, если узлы рядом с ним являются блочными элементами.

person T.J.    schedule 19.10.2011

arrow_upward
0
arrow_downward

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

это, безусловно, более разборчиво, чем изменение типа отображения для всех изображений. лучшей альтернативой было бы создание класса css img.block {display:block;} + <img class="block"/>

person pstanton    schedule 28.01.2010

arrow_upward
0
arrow_downward

Нет ничего плохого в том, чтобы изображения были с <p></p> или без них. Единственное, что вы должны иметь в виду, это:

  1. CSS для <p> может повлиять на отступы, поля или ширину изображения так, как вы этого не хотите.
  2. <p> заставит изображение отображаться как блок.
  3. Если это ваша единственная цель, я бы посоветовал вам включить это правило в свой CSS как img {display: block;} и оставить <img> без <p></p>.
  4. Если изображения на вашем сайте будут представлять собой смесь блочных элементов и встроенных элементов, я бы рекомендовал создать класс для каждого и указать img {display: block;} и img {display: inline;}
person Satchito    schedule 11.05.2018