手機端頁面不同大小適配
阿新 • • 發佈:2018-12-28
適配:
<meta name="viewport" content="initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
width - viewport的寬度 height - viewport的高度
initial-scale - 初始的縮放比例
minimum-scale - 允許使用者縮放到的最小比例
maximum-scale - 允許使用者縮放到的最大比例
user-scalable - 使用者是否可以手動縮放
/*6*/ @media (min-device-width:320px) and (max-device-width:375px) { body{font:12px/1.5 "Microsoft Yahei";} } @media (min-device-width:375px) and (max-device-width:376px) { body{font:14px/1.5 "Microsoft Yahei";} } /*6+*/ @media (min-device-width:386px) and (max-device-width:400px) { body{font:13px/1.5 "Microsoft Yahei";} } @media (min-device-width:401px) and (max-device-width:640px) { body{font:15px/1.5 "Microsoft Yahei";} } @media only screen and (min-device-width:1079px) and (-webkit-min-device-pixel-ratio:2.5){ body{font:13px/1.5 "Microsoft Yahei";}}