Slyweb
На разработку сайта! Скидки 50%!
Поиск CSS свойств и HTML элементов:
поиск



Все CSS свойства и HTML элементы справочника
<IMG src="..." />

Атрибут src

Значение атрибута src может содержать как относительный, так и абсолютный путь к изображению:

  1.<img src="img.jpg">
  2.
  3.<img src="http://test.ru/img/img.jpg">
  4.

Атрибут alt

Атрибут alt необходим для отображения альтернативного текста, если в браузере пользователя отключены изображения. Данный атрибут учитывается поисковыми системами при индексации документа.

Атрибут align

Значение атрибута align (атрибут помечен как нежелательный к применению):

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

Согласно спецификации вставлять изображение на страницу рекомендуется с помощью элемента OBJECT, но в то же время допускается использовать элемент специально для этого предназначенный. Ниже приведены два примера, обладающих одинаковой функциональностью:

  1.Молчание никому не вредит, вредит болтливость.
  2.<IMG src="http://www.somecompany.com/People/Ian/vacation/family.png"
  3. alt=" Древнеримская поговорка.">
  4....содержимое страницы...
  5.Нобелевская премия — это спасательный круг,
  6.который бросают пловцу, когда тот уже благополучно достиг берега.
  7.<OBJECT data="http://www.somecompany.com/People/Ian/vacation/family.png"
  8. type="image/png">
  9.Бернард Шоу
10.</OBJECT>
11.

  1.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
  2.<HTML>
  3.<HEAD>
  4. <TITLE>Вставка изображения разными способами</TITLE>
  5.</HEAD>
  6.<BODY>
  7. <img src="img.jpg">
  8. <object data="img.jpg" type="image/jpg">
  9.</BODY>
10.</HTML>
11.
Вставка изображения разными способами
Вставка изображения разными способами

Атрибуты width и height изменяют изначальные размеры изображения. В приведенном ниже примере ширина и высота изображения будут соответствовать 100 px.

  1.<img src="img.jpg" width="100" height="100">
  2.
Атрибуты width и height позволяют ускорить загрузку изображения, так как при их явном указании браузер должен резервировать место для них и продолжать загружать содержимое страницы, не дожидаясь загрузки изображения.

Атрибуты vspace и hspace.

Атрибуты vspace и hspace. Данные атрибуты позволяют устанавливать внешние отступы от изображения.

  1.<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
  2.<HTML>
  3.<HEAD>
  4. <TITLE>vspace и hspace</TITLE>
  5.</HEAD>
  6.<BODY>
  7.<img src="110.gif" vspace="20" hspace="20" style="float:left;">
  8.Доброй хозяйке должность есть: быть тихой, скромной,
  9.постоянной, осторожной; к Богу усердной, к свекру и
10.свекрови почтительной; с мужем обходиться любовно и
11.благочинно, малых детей приучать к справедливости и
12.любви к ближнему; перед родственниками и свойственниками
13.быть учтивой, добрые речи слушать охотно, лжи и лукавства
14.гнушаться; не быть праздной, но радетельной на всякое
15.изделие и бережливой в расходах.
16.Екатерина Великая
17.</BODY>
18.</HTML>
19.
vspace и hspace
vspace и hspace
Изображение, помещенное в элемент A, будет окружено рамкой, регулирование которой осуществляется атрибутом border элемента img.


Доступ и установка с jQuery

  • Получить коллекцию элементов IMG: val = $("IMG");
  • Получить класс элементаIMG: val = $("IMG").attr("class");
  • Установить несколько CSS свойств HTML элементу IMG: $("IMG").css({"...":"..."});
  • Установить единичное CSS свойство HTML элементу IMG: $("IMG").css("...","...");
  • Как использовать jQuery для HTML, - читайте статью "jQuery и HTML для начинающих".
Александр Ермаков. Хостинг - www.pwstudio.org