Как разместить изображения поверх другого?

Question

[Александр Тищенко]

Привет
Есть одна идея, не знаю как её реализовать.
Идея заключается вот в чём.
У меня есть сайт. на сайте есть аватарки пользователей.
Я хочу что-бы поверх аватарки, отображалась ещё одно изображение, но уже анимированное.
То бишь, есть аватарка, а по верх ней, аннимированная рамка)
надеюсь вы поняли что я хочу)

Comments

[Vladislav]

https://atuin.ru/blog/animirovannye-ramki-dlya-blo...
Посмотри может не нужно будет лишнего изображения грузить.
Если найдешь решения на css
Если нет, то пробуй через before, after

[Александр Тищенко]

Владислав, это нормальный вариант) но не то, наложение должно быть гиф-картинкой на картинку. т.е. из MySQL загружается фото человека, а поверх фото ещё рамка)

Answer 1

[AAVdev]

z-index в блоке где выводится слой с аватарой и в этот же блок слой с гифкой

Answer 2

[Bilkash]

ну тут скорее работа со стилями, если я все правильно понял
для изображения аватара в css файле
z-index: 1

Для анимированной рамки
z-index: 10
ну или еще больше, главное что бы значение было больше чем у картинки "снизу"

Comments

[Ankhena]

для изображения аватара в css файле
z-index: 1

Для анимированной рамки
z-index: 10

Достаточно 0 и 1. Не нужно придумывать лишние слои.