Что можно сделать с картинкой на сайте

В этой статье описывается настройка отображения изображений (картинок) на вашем сайте. В статье как вставить картинку в ucoz я упомянул, что после добавления изображения можно изменить его атрибуты. В этой статье я опишу эти самые атрибуты и напишу о том, что можно сделать с вставленной картинкой и как изменить ее отображение без использования стилей css.

Простейший код картинки вставленной на страницу:

<img src="/kartinka.png">

В этом коде указан относительный путь к картинке, она должна быть загружена в корень сайта, также можно указывать абсолютный адрес картинки:

<img src="http://site.ru/kartinka.png" >

Здесь не предугадать как изображение будет обтекаться текстом, где оно будет расположено, поэтому нужно добавить атрибуты для расположения картинки. Для того, чтобы картинка была слева от текста и отступ от изображения до текста по горизонтали был 5 пикселей используем такой код:

<img src="/kartinka.png" align="left" hspace="5">

align="left" - этот атрибут говорит что изображение будет слева от текста. Текст также можно расположить справа (right) или по центру (center).

hspace="5" - Вместо "5" можно использовать любое другое значение.

Другие атрибуты для изображения

height="100" - высота
width="100" - ширина

Высоту и ширину можно указать в пикселях или процентах, например, если вы хотите чтобы изображение "сжалось" на 50% используем следующий код:

<img src="/kartinka.png" align="left" hspace="5" width="50%" height="50%">

alt="текст" - текст, который браузер выводит, если картинка не отображается в браузере.
title="текст" - текст, который показывается при наведении курсора к изображению.
border="1" - толщина рамки вокруг картинки

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

Копишь на iphone 3g? Может лучше купить 4G? Узнать iphone 4g стоимость можно на сайте hi-tech.tochka.net.


23.05.2012 | Просмотров: 1873
Есть вопросы по Ucoz? Задай их на форуме! А мы постараемся ответить.