Как наложить картинку на картинку в html

Question

Aleksey · Accepted Answer

Для наложения картинки на картинку в HTML можно использовать абсолютное позиционирование. Для этого необходимо создать контейнер, который будет содержать обе картинки, и применить к этому контейнеру относительное позиционирование. Затем, для каждой картинки нужно задать абсолютное позиционирование и указать координаты ее расположения относительно родительского контейнера. Например:

<div class="container">
  <img src="image1.jpg" class="image image1" />
  <img src="image2.jpg" class="image image2" />
</div>

В данном примере изображения с размерами 300x200 будут распологаться одна над другой.

``` ```css .container { position: relative; } .image { width: 300px; height: 200px; } .image1 { position: absolute; top: 0; left: 0; } .image2 { position: absolute; top: 0; left: 0; } ``` В данном примере изображения с размерами 300x200 будут распологаться одна над другой.

Ирек Исанбирдин · Answer

у меня почему то не работает этот способ. 
Есть фоновая картинка, которая собрана наложением одной на другую.

Hotaka Rostov · Answer

Всё работает.
Спасибо за мануал

Как наложить картинку на картинку в html

Ответы

Каталог