Название

Изображения в HTML. Элемент img.

Графика и изображения на современных веб-страницах стали уже одним из обязательных элементов. Использовать их в работе приходится очень часто.

1391085303_image-x-generic

В этой заметке хочу рассказать о средствах HTML, которые позволяют работать с изображениями на веб-страницах.

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

30-01-2014 12-11-56

Чтобы вставить изображение на веб-страницу, нужно просто указать браузеру путь до того места, где оно храниться, его имя и расширение. Браузер будет выделять специальное пространство на веб-странице и в этом месте отображать изображение.

Технология работы примерно такая.

Теперь к практике.

Элемент, который отвечает за вставку изображений на веб-страницу - это одинарный тэг <img> с обязательным атрибутом src, с помощью которого нужно указать путь к изображению.

<img src="путь к изображению">

Элемент img относится к строчным элементам.

Путь к изображению может быть либо абсолютным, либо относительным. Подробнее об этом здесь.

Давайте посмотрим, как это работает на практике. В следующем примере вставляется изображение, которое находится на моем сайте.

<img src="//webgyry.info/images/arrow.jpg">

В общем, это основа, которую нужно знать о вставке изображений на веб-страницу. Давайте еще рассмотрим два атрибута элемента img, которые позволяют изменять размер вставленного изображения.

Назад Далее