Microsoft Surface Pro 3& Media的媒体查询Surface Pro 4

时间:2016-04-21 20:42:51

标签: responsive-design media-queries

为Surface Pro 3& amp;编写媒体查询的最佳方式是什么? 4?在景观和人像观点?

1 个答案:

答案 0 :(得分:1)

最好的方法是不要为特定设备编写媒体查询,而是在设计中识别逻辑位置以折叠元素或相应地分解元素,以便考虑任何宽度的设备。

有关详细信息,请参阅此文章:Google Developers—How to Choose Breakpoints

实际上,您提到的这两种设备的分辨率是2160x1440(Surface Pro 3)和2736x1824(Surface Pro 4)。因此,不是为媒体查询设置这四个断点,而是设计为大于2000px",#34;在1200px和2000px之间,#34;和#34; 1200px" - 第一个规则处理您在横向模式中提到的设备(也处理常见的桌面分辨率),第二个规则处理纵向模式下的设备(和许多其他常见的便携式设备),以及最后一个规则处理设备尺寸低于1200px。

这只是解决问题的一种方法,我建议您更仔细地研究响应式设计和断点选择背后的常用理论。