图片叠加示例

   .aa {

            width: 100%;

            height:100%;

            position: absolute;

   --图片1.png与图片2.png 叠加起来

            background: url(1.png) left top no-repeat,url(2.png) left top no-repeat;

            background-color:#87c3ff;

            background-size:contain;

        }

或者：

   .aa {

            width: 100%;

            height:100%;

            position: absolute;

            background:url(2.png) left top no-repeat;--1.png图片

            background-color:#87c3ff;

            background-size:contain;

        }

        .aa:before{

            width: 100%;

            height: 100%;

            border:1px  solid black;

            position: absolute;

            top: 150px;;

            left:150px;

            content:'';

            background:url(1.png) left top no-repeat;--2.png图片

            background-size:20%;

        }

效果图：

 参考文献：

::before和::after伪元素的用法 - starof - 博客园

Multiple Backgrounds and Borders with CSS 2.1 – Nicolas Gallagher