Введите ваш адрес почты


sdcvoy.ru
Понравился сайт? Поделись с друзьями!
Главная » Html » Izobrazheniya-v-html

Изображения в html. Вставка картинки

Изображения в html позволяют разнообразить страницу картинками, менять фон страницы, ну и всё в таком духе. Вообще говоря о графике в нынешнее время нельзя говорить только о стандарте html, следовало бы упомянуть ещё и CSS, но в данном разделе я рассказываю только об HTML. Поэтому начнём!

Для вставки картинки html на страничку используется одиночный тег <img>, с обязательным атрибутом scr, который указывает путь к файлу изображения. Вот вам небольшой пример, того как используется данный тег:

<p><center><img src="../img/logotip.jpg" alt="Это логотип сайта">
</center></p>

В результате вы можете увидеть такой результат:

Выравнивание изображения

Вы должно быть заметили что данное изображение выравнено по центру. Задать расположение, точнее сказать обтекание текстом картинку можно с помощью знакомого вам атрибута align со следующими значениями:

Также используются такие атрибуты тега img, как HSPACE и VSPACE, которые задают ширину текста относительно картинки по горизонтали и вертикали соответственно.

Следует почти всегда использовать такие атрибуты как width и height, которые задают ширину и высоту изображения, причем можно задавать значения как в относительной величине — в процентах (%), так и в абсолютной — в пикселях (px).

Задание фона в html

Для фона используются два атрибута — это bgcolor и background. Атрибут bgcolor используется для создания сплошного фона из выбранного цвета:

 <body bgcolor="green">
<p>Этот текст будет расположен на зеленом фоне</p>
</body>  

Универсальный атрибут background используется для вставки картинки в фон документа, причем если изображение имеет меньший размер, чем сама страничка документа, то это изображение автоматически повторяется и заполняет всю страничку сайта:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
 <meta http-equiv="content-type" content="text/html;
  charset=utf-8">
 <title>Фон сайта</title>
 </head>
 <body background="../img/logotip.jpg"> 
  <p>Этот текст будет расположен на фоне с логотипом</p>
  </body>
</html>

Результат будет примерно таким:

Фон сайта с помощью изображения



наверх