Изображения
Для размещения картинки на страницу используется тег <img />.
Использовать можно изображения с типом файлов: GIF, PNG и JPG(JPEG).
Чтобы на сайте было видно изображение нужно прописать в самом теге атрибут src с адресом картинки:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Изображение</title>
</head>
<body>
<img src="img.jpg" alt="" />
</body>
</html>Пример кода
Как и в гиперссылках адрес можно писать абсолютный или относительный.
В тег <img /> ещё пишут атрибут alt с текстом. Этот текст будет отображаться до загрузки изображения или при отсутствии картинки.
Тег <img /> можно сделать ссылкой. Для этого небходимо <img /> поместить между тегами <a> и </a>:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Ссылка-изображение</title>
</head>
<body>
<a href="img2.jpg"><img src="img.jpg" alt="" /></a>
</body>
</html>При клике на изображение у нас отобразится картинка img2.jpg:
Мы можем изменить размер изображения задав ему значения параметров высоты и ширины. Для указания высоты используется атрибут height, а ширины width. В следующем примере мы зададим высоту и ширину картинки:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Изображение и его размеры</title>
</head>
<body>
<img height="450px" width="300px" src="img3.jpg" alt="" />
</body>
</html>В браузере будет виден оригинальный размер картинки:
Следующая статья: Списки.
Обновлён: 19.10.2024 16:38:52
0 Комментарии