关于#盒子#的问题，如何解决？

怎么做这个盒子啊？

img

题主要的代码如下，有帮助麻烦点个采纳【本回答右上角】，谢谢~~有其他问题可以继续交流~

img


<style>
    .inlineblock,.inlineblock div{display:inline-block}
</style>
<div style="border:#999 2px dashed;border-radius:3px;padding:30px" class="inlineblock">
    <div style="border:#dbecfb 5px solid;background:#f6f5f7;padding:30px">
        <div style="background:#ffa0e0;padding:50px">
            <div style="border:#fff 1px dashed;padding:2px">

                <div style="border:#fff 2px dashed;padding:2px;padding:70px">
                    <div style="background:#ffff00;padding:5px">

                        <div style="background:#98ff38;width:150px;height:150px">

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

</div>

盒子套盒子 div套div 居中 给不一样的border 和 background-color


<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style>
            .div-one {
                width: 500px;
                height: 500px;
                position: relative;
                border: 1px solid #ff871e;
            }

            .div-two {
                position: absolute;
                left: 0;
                right: 0;
                top: 0;
                bottom: 0;
                margin: auto;
                width: 450px;
                height: 450px;
                background-color: #ff871e;
            }
            .div-three {
                position: absolute;
                left: 0;
                right: 0;
                top: 0;
                bottom: 0;
                margin: auto;
                width: 400px;
                height: 400px;
                background-color: red;
            }
            .div-four {
                position: absolute;
                left: 0;
                right: 0;
                top: 0;
                bottom: 0;
                margin: auto;
                width: 350px;
                height: 350px;
                background-color: wheat;
            }
        </style>
    </head>
    <body>
        <div class="div-one">
            <div class="div-two">
                <div class="div-three">
                    <div class="div-four"></div>
                </div>
            </div>
        </div>
    </body>
</html>