div+css文字“本来”_html/css_WEB-ITnose

   

   

   

   

   

   

   

        *{

            margin: 0;

            padding:0;

        }

       

        .main_obj{

            width: 500px;

            height: 240px;

            /*background-color: #9cf;*/

            margin:0 auto;

            margin-top: 200px;

        }

        .ben_main,.lai_main{

            height: 230px;

            width: 220px;

            overflow: hidden;

            float: left;

            /*background-color: #cccccc;*/

        }

        .ben{

            background-color: #464646;

            position: relative;

        }

        .ben_1{

            height: 25px;

            width:190px;

            top: 45px;

            left: 14px;

        }

        .ben_2{

            width: 25px;

            height:234px;

            left: 95px;

        }

        .ben_3{

           width: 143px;

            height: 220px;

            border: 20px solid #464646;

            position:relative ;

            border-radius:100px;

            top: -177px;

            left:17px;

        }

        .ben_4{

           width: 80px;

           height: 25px;

           top: -330px;

           left:68px;

        }

        .lai_main{

            float: right;

            /*background-color:#ccc ;*/

        }

        .lai_1{

            top: -140px;

        }

        .lai_2{

            width: 150px;

            height: 150px;

            border: 20px solid #98b821;

            border-radius:100px ;

            position: relative;

            top: -151px;

            left: -13px;

        }

        .lai_3{

            height: 40px;

            width: 180px;

            overflow: hidden;

            /*background-color: red;*/

            position: relative;

            top: -441px;

            left: 25px;

        }

        .lai_4{

            width: 20px;

            height: 40px;

            background-color:#98b821 ;

            position: relative;

            top: -482px;

            left: 38px;

            transform:rotate(35deg);

        }

        .lai_4:before{

            content: "";

            display: block;

            width: 15px;

            height: 20px;

            background-color: #ffffff;

            position: relative;

            left: -15px;

            top: 4px;

        }

        .lai_5{

            transform:rotate(145deg);

            position: relative;

            left: 155px;

            top: -522px;

        }

        .lai_5:before{

            content: "";

            position: relative;

            left: -15px;

            top: 15px;

        }

        .lai2_out{

            height: 61px;

            width: 188px;

            /* background-color: #0092DC; */

            position: relative;

            top: -446px;

            left: 15px;

            overflow: hidden;

            transform: rotate(2deg);

        }

        .lai2_1{

            width: 150px;

            height: 150px;

            border: 20px solid #98b821;

            border-radius: 100px;

            position: relative;

            top:-142px;

        }

        .lai2_2{

            width: 20px;

            height: 33px;

            background-color: #98b821;

            position: relative;

            top: -183px;

            transform: rotate(45deg);

            left: 27px

        }

        .lai2_2:before{

            content: "";

            display: block;

            width: 23px;

            height: 34px;

            background-color: #ffffff;

            position: relative;

            top: 0px;

            left: -23px;

        }

        .lai2_3{

            transform:rotate(135deg);

            top: -222px;

            left: 150px;

        }

        .lai2_3:before{

            position: relative;

            top: 13px;

            left: -23px;

        }