首页 > 其他 > 详细

媒体查询

时间:2020-01-02 23:35:39      阅读:96      评论:0      收藏:0      [点我收藏+]

 媒体查询代码,一般是表示只有在屏幕尺寸小于或大于某某像素才应用某一样式

例如:

<meta name="viewport" content="width=device-width, initial-scale=1"/>

 

@media only screen and (max-width:639px)...

 

手机端的代码一般把宽度写成百分比,图片的宽度写成百分比会根据屏幕自动缩放,写成一个最大值就可以。

@media only screen and (min-width: 1080px) and (max-width: 1300px) {
    html {
        font-size: 8.32px;
    }
}
@media only screen and (min-width: 1300px) and (max-width: 1580px)
{ html { font-size: 11.38px; } } @media only screen and (min-width: 1580px) and (max-width: 1900px) { html { font-size: 13.29px; } } @media only screen and (min-width: 1900px) and (max-width: 2560px) { html { font-size: 16px; } }

媒体查询

原文:https://www.cnblogs.com/Su-feng-address/p/12049745.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!