美文网首页
day3 作业 2018-08-16

day3 作业 2018-08-16

作者: LPP27149 | 来源:发表于2018-08-16 10:28 被阅读0次
    效果图
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8" />
            <title></title>
            <style type="text/css">
                *{
                    margin: 0;
                    padding: 0;
                }
                
                .ml,.mm,.mr{
                    float: left;
                    margin-left: 10px;
                    background-color: white;
                }
                .m1{
                    margin-left: 10px;
                    }
                    
                .m2{
                    float: left;
                    margin-left: 10px;
                }
                
                .m3{
                    float: right;
                    margin-left: 10px;
                }
                span{
                    color: rgba(0,0,0,0.4);
                    font-size: 10px;
                }
                h2{
                    font-size: 40px;
                    height: 40px;
                    position: relative;
                }
                .quan{
                    width: 40px;
                    height: 40px;
                    display: inline-block;
    
                }
                
            </style>
        </head>
        <body>
            <div style="background-color: azure; overflow: hidden;">
                <h1 align="center">—— 居家好物 ——</h1>
                <div class="ml">
                    <img src="img/img.png"/>
                </div>
                <div class="mm">
                    <h2>家电馆<img class="quan" src="img/quan.png"/><span>家电好购物节</span>
                    <div class="m1"><img src="img/img2.png"/></div>
                    <div class="m2"><img src="img/img3.png"/></div>
                    <div class="m3"><img src="img/img4.jpg"/></div>
                </div>
                <div class="mr">
                    <h2>我爱我家<img class="quan" src="img/quan.png"/><span>品质生活家</span>
                    <div class="m1"><img src="img/img5.jpg"/></div>
                    <div class="m2"><img src="img/img6.jpg"/></div>
                    <div class="m3"><img src="img/img7.jpg"/></div>
                </div>
                <div class="foot"></div>
                <div class="foot"></div>
                <div class="foot"></div>
            </div>
        </body>
    </html>
    

    相关文章

      网友评论

          本文标题:day3 作业 2018-08-16

          本文链接:https://www.haomeiwen.com/subject/jssnbftx.html