Игра на «Морской Бой» на JavaScript: «Простая Игра» и «Игра для Двоих»
Yutex - Платный хостинг PHP.
Advego.ru - система покупки и продажи контента для сайтов, форумов и блогов

Интернет-магазин под ключ

Статьи для сайтов!!!
Главная HTML по шагам Теги HTML Тег img Тег input

Тег img

Описание тега IMG

Тег <img> предназначен для вставки изображения (например, фотографии) на страницу.

Для вставки на страницу используются изображения в одном из трех графических форматов (подробнее здесь...):

- gif
- jpg/jpeg
- png

Закрывающий тег

Не имеет


Атрибуты тега IMG

Src – обязательный атрибут, который задает адрес файла с изображением.

Значения атрибута

Абсолютный или относительный путь к файлу (подробнее здесь...)

Значение по умолчанию

-

Align – выравнивание изображения по горизонтали/вертикали.

Значения атрибута

- left - выравнивание изображения по левому краю станицы, текст будет обтекать справа
- right – выравнивание изображения по правому краю станицы, текст будет обтекать слева.
- top - верхняя граница изображения выравнивается по уровню самого высокого элемента текущей строки
- bottom – нижняя граница изображения выравнивается по базовой линии текущей строки.
- middle – выравнивание середины изображения по базовой линии текущей строки

Значение по умолчанию

- bottom

Alt – альтернативный текст к изображению, который будет отображен вместо изображения, если браузер еще (вообще) не загрузил его или оно отсутствует по каким-то другим причинам.

Значения атрибута

Любой текст

Значение по умолчанию

-

Border – отображает рамку вокруг изображения.

Значения атрибута

Указывается целое положительное число, которое задает толщину рамки в пикселях.

Значение по умолчанию

- 0

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

Height и Width – высота и ширина изображения.

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

Величина изображения на скорость его загрузки не влияет. А это увеличивает время загрузки страницы.

Значения атрибута

Целое положительное число в пикселях или в процентах

Значение по умолчанию

- Исходный размер изображения

Hspace и Vspace – отступы по горизонтали и вертикали соответственно от изображения до других объектов страницы в пикселях.

Значения атрибута

Указывается целое положительное число

Значение по умолчанию

- 0

Title – добавляет всплывающую подсказку при наведении на изображение курсора.

Значения атрибута

Любой текст

Значение по умолчанию

-


Пример - тег img - атрибут align

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title> Тег <img> </title>
</head>
<body>

<p> <img src="img/peng_32.gif" align="left">
Выравнивание изображения по левому краю страницы, текст будет обтекать справа </p> <br>
<p> <img src="img/peng_32.gif" align="right">
Выравнивание изображения по правому краю страницы, текст будет обтекать слева </p> <br>
<p> <img src="img/peng_32.gif" align="top" border="1">
Верхняя граница изображения выравнивается по уровню самого высокого элемента
текущей строки
</p>
<p> <img src="img/peng_32.gif" align="bottom" border="1">
Нижняя граница изображения выравнивается по базовой линии текущей строки </p>
<p> <img src="img/peng_32.gif" align="middle">
<u> Выравнивание середины изображения по базовой линии текущей строки </u> </p>

</body>
</html>

Выравнивание изображения по левому краю страницы, текст будет обтекать справа


Выравнивание изображения по правому краю страницы, текст будет обтекать слева


Верхняя граница изображения выравнивается по уровню самого высокого элемента текущей строки

Нижняя граница изображения выравнивается по базовой линии текущей строки

Выравнивание середины изображения по базовой линии текущей строки


Пример - тег img

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title> Тег <img> </title>
</head>
<body>

<p> <img src="img/peng_64.gif" border="1" title="Пингвин" align="left" vspace="20"
hspace=
"20" height="64" width="64">
Изображение выравнивается по левому краю страницы. <br>
Толщина рамки вокруг изображения составляет 1 пиксель. <br>
Отступы по горизонтали и вертикали от изображения до других объектов страницы (<em>в данном случае до текста </em>) 20 пикселей. <br>
Высота и ширина изабражения 64 пикселя. </p>

</body>
</html>

Изображение выравнивается по левому краю страницы.
Толщина рамки вокруг изображения составляет 1 пиксель.
Отступы по горизонтали и вертикали от изображения до других объектов страницы (в данном случае до текста) 20 пикселей.
Высота и ширина изабражения 64 пикселя.


Тег html Тег img Тег input
Теги HTML
Дизайн сайтов
ПОИСК ПО САЙТУ:

Моё имя Антон. Связаться со мною Вы можете по e-mail: averagev@mail.ru