三星 Galaxy A20 视口尺寸

问题描述

我必须为 Samsung A20 编写纵向和横向的自定义媒体查询,但我找不到 视口。有人知道吗? (不适用于 A20s 或 A20e)。

谢谢

解决方法

您可以在此处根据您的要求更改最小和最大宽度

@media only screen and (min-width: 200px) and (max-width: 414px) and (orientation : portrait) {
                    //Put your CSS here for 200px to 414px width devices (cover all mobile portrait width //        
              }
        
        
 @media only screen and (min-width: 500px) and (max-width: 767px) and (orientation:landscape) {
                    //Put your CSS here for 500px to 7674px width devices (cover all mobile landscape width //        
              }
,

可以查询当前设备视口大小:

window.innerWidth
window.innerHeight
,

嗯,简而言之,如果您将目标定位为所有移动设备,您几乎会发疯。因此,我作为前端开发人员的建议是,您应该始终寻找主要断点,并且永远不要忘记从媒体查询中的“最大宽度”开始......最大宽度将帮助您定位从 0 到 396px 或396 像素到 768 像素。但是 min-width 允许从 396px 到 0。 所以最大宽度是最好的选择 和 寻找移动设备的主要断点

,

A20 肖像的媒体查询: @media only screen and (min-device-width: 320px) and (max-device-height: 694px)

(我对 WebKit 不太确定,但您可以尝试 2.2)

和 (-webkit-device-pixel-ratio: 2.2)