HTML Продвинутая работа с изображениями • srcset, picture, WebP и AVIF, preload, figure и figcaption
Html+css: выравнивание блока по центру
В этой статье Практики HTML, мы познакомимся с тремя техниками центрирования блока Margin+width Этот фокус позволяет центрировать блок заранее определённой ширины, независимо от ширины экрана. Кроме того, если использовать max-width вместо width, то, даже если размер экрана пользователя окажется меньше ширины этого блока, то блок не выйдет за границы экрана, а будет равен ширине экрана. Это весьма распространенная практика. Техника проста: margin: 0 auto;
max-width: 500px; и ваш блок (именно блочный элемент, а не строчный) окажется ровно в центре страницы...
Работа с изображениями на HTML
Давайте теперь разберемся с тем, как разместить изображение на странице вашего сайта. Для этого предназначен тег <img>, имеющий обязательный атрибут src, в котором следует задавать путь к файлу картинки. При этом сам тег не требует закрывающего тега. Давайте посмотрим на примере. Пусть в корневой папке нашего сайта находится файл smile.png с картинкой. Давайте выведем ее на странице нашего сайта: Задача 1 Разместите на странице вашего сайта какую-нибудь картинку. Ширина картинки По умолчанию картинки отображаются своим реальным размером...