码迷,mamicode.com
首页 > 移动开发 > 详细

CSS3自适配手机屏幕

时间:2016-04-23 10:09:47      阅读:382      评论:0      收藏:0      [点我收藏+]

标签:

       @media only screen and (max-width:350px){
          .img{  
             width: 80px;
             height:70px;
             background-image: url(./images/heart2.png);
             background-size: 100% 100%;
             float: left;
             margin-top: 5%;
             margin-left: 5%;
             font-size: 10px;      
        } 
      }
       @media only screen and (min-width:350px){
      .img{  
             width: 100px;
             height: 85px;
             background-image: url(./images/heart2.png);
             background-size: 100% 100%;
             float: left;
             margin-top: 8%;
             margin-left: 5%;
             font-size: 10px;      
        }
      }

根据屏幕大小(长宽)来调整css样式,达到手机屏幕适配的效果。

CSS3自适配手机屏幕

标签:

原文地址:http://www.cnblogs.com/kangshuai/p/5423959.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!