CSS Z-index для фоновых изображений

Question

У меня есть два фоновых изображения - a и b. Автоматически A находится перед B. Могу ли я изменить это с помощью Z-индекса?

Answer 1

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

Answer 2

У вас может быть несколько фоновых изображений ... но порядок укладки определяется порядком, указанным в вашем CSS.

background: 
    url(number.png) 600px 10px no-repeat, /* On top, like z-index: 4; */ 
    url(thingy.png) 10px 10px no-repeat, /* Middle like z-index: 3; */ 
    url(Paper-4.png);      /* On bottom, like z-index: 1; */ 

CSS-Tricks Article