Рассмотрим способы выравнивания рисунков в
тексте.
Для выравнивания рисунков в тексте используются следующие
атрибуты:
ALIGN -
определяет способ выравнивания картинки по горизонтали. Очень полезное
свойство при обтекании картинки текстом. Обычно используют
LEFT (выравнивание по левому краю, текст будет обтекать справа) и
RIGHT (выравнивание по правому
краю, текст обтекает слева) .Если на странице есть текст, то это
обязательное свойство.
HSPACE и VSPACE
- отступы в пикселях по горизонтали и по вертикали от картинки до других
объектов документа. Легко запомнить название, если взять и просто перевести
с английского. HSPACE - Horizontal Space - горизонтальный отступ и VSPACE -
Vertical Space - вертикальный отступ.
HEIGHT и WIDTH -
высота и ширина изображения в пикселах. Золотое правило web-мастера – всегда
явно задавать размеры картинки в атрибутах HEIGHT и WIDTH, резервируя тем
самым место в окне браузера еще до загрузки изображения. В противном случае
документ при загрузке каждой картинки будет заново перерисовываться. А на
медленных машинах (или при подключении к сети через модем) это смотрится
просто отвратительно. Но в принципе, можно и не задавать размеры, просто
будет дольше загружаться.
Полезное правила
- не искажайте реальные размеры картинки.
Пример:
<!--выравниванием по
левому краю-->
<p align="justify">
<img src=" images.jpg " width="65"
height="59" hspace="15" vspace="15" align="left">
HEIGHT и WIDTH - высота и ширина изображения в пикселах. Золотое правило
web-мастера – всегда явно задавать размеры картинки в атрибутах HEIGHT и
WIDTH, резервируя тем самым место в окне браузера еще до загрузки
изображения. В противном случае документ при загрузке каждой картинки будет
заново перерисовываться. А на медленных машинах (или при подключении к сети
через модем) это смотрится просто отвратительно. Но в принципе, можно и не
задавать размеры, просто будет дольше загружаться.</p>
<!-- второй
пример с отступами и выравниванием по правому краю-->
<p align="justify">
<img src=" images.jpg " width="65"
height="59" hspace="15" vspace="15" align="right">
HEIGHT и WIDTH - высота и ширина изображения в пикселах. Золотое правило
web-мастера – всегда явно задавать размеры картинки в атрибутах HEIGHT и
WIDTH, резервируя тем самым место в окне браузера еще до загрузки
изображения. В противном случае документ при загрузке каждой картинки будет
заново перерисовываться. А на медленных машинах (или при подключении к сети
через модем) это смотрится просто отвратительно. Но в принципе, можно и не
задавать размеры, просто будет дольше загружаться.</p>
<!--третий
пример без отступов, с выравниванием по левому краю-->
<p align="justify">
<img src=" images.jpg " width="65"
height="59" align="left">
HEIGHT и WIDTH - высота и ширина изображения в пикселах. Золотое правило
web-мастера – всегда явно задавать размеры картинки в атрибутах HEIGHT и
WIDTH, резервируя тем самым место в окне браузера еще до загрузки
изображения. В противном случае документ при загрузке каждой картинки будет
заново перерисовываться. А на медленных машинах (или при подключении к сети
через модем) это смотрится просто отвратительно. Но в принципе, можно и не
задавать размеры, просто будет дольше загружаться.
нажмите чтобы увидеть результат
|