基础系列：自适应

  • 设备屏幕宽度最大宽度是320px
 @media screen and (max-width: 320px){
            .left{
                float: none;
                width: auto;
                margin-right: 0;
                margin-bottom: 20px;
                background-color: #333366;
            }
        }

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <style>
        .left{
            float: left;
            width: 100px;
            margin-right: 20px;
        }
        .right{
            overflow: hidden;
            background-color: #006699;
        }
        @media screen and (max-width: 320px){
            .left{
                float: none;
                width: auto;
                margin-right: 0;
                margin-bottom: 20px;
                background-color: #333366;
            }
        }
    </style>
</head>
<body>
    <div class="parent">
       <div class="left">
           <p>left</p>
       </div>
       <div class="right">
           <p>right</p>
           <p>right</p>
       </div>
    </div>
</body>
</html>

 

posted @ 2015-08-09 11:36  哪有公园可以住的呀  阅读(114)  评论(0)    收藏  举报