Почему <p>появится после set align = "left" on <img>

Question

<img ...>
<p>..</p>

Без установки align="left" на img, p начнется с пустой строки.

<img ... align="left">
<p>..</p>

Но после установки align="left", p появится около img, почему?

Answer 1

Полагаю, что <img> align attribut будет работать как CSS-свойство float. Это заставляет ваше изображение плавать. Если вы хотите, чтобы <p> оставался под <img>, то вы должны сделать это следующим образом.

<img ... align="left" />
<div style="clear: both;"></div>
<p>..</p>

---

Плавающее изображение влево или вправо с использованием CSS

HTML использует атрибут выравнивания:

<img src="image.jpg" align="right">

XHTML использует встроенный стиль:

<img src="image.jpg" style="float: right" /> 

---

Доказательство: HTML img align Атрибут

Атрибут выравнивания <img> равен устарела и не поддерживается в HTML 4.01 Strict / XHTML 1.0 Strict DTD.

Вместо этого используйте CSS.

Синтаксис CSS: <img style="float:right" />

Answer 2

Установка атрибута align html влево или вправо на изображении эквивалентна css-обработке плавающего изображения.

Answer 3

Возможно, лучше попробовать:

<p><img align="left" /></p>

Или может быть:

<img align="left" />
<p style="clear:left"></p>

Answer 4

Читайте о встроенных и блочных элементах. Я не помню ни одного хорошего сайта (на английском языке) с объяснением различий между этими двумя типами прямо сейчас, поэтому попробуйте Google it .

Установка align="left" (это должно быть преобразовано в эквивалент в CSS: float: left) делает элемент img плавающим. Еще раз прочитайте о поплавках.