随着手机科技的发展，现代手机的手机屏幕分辨率越来越高，从而为用户提供更加清晰和细致的显示效果。但是，这也给前端开发人员带来了一些挑战，尤其是在使用CSS编写移动端样式时。

由于手机屏幕分辨率高，CSS中的px实际对应的物理像素数也随之增加。这就导致了CSS中的尺寸单位变得非常小，而看起来元素的大小却异常巨大。当然，这违背了我们编写CSS的初衷，因为我们想要的实际上是在手机屏幕上看起来适合的尺寸。

那么，该怎样解决这个问题呢？最简单的解决方法是使用视口缩放。例如，当使用iPhone7 Plus（分辨率为1080 x 1920）时，将视口缩放到0.5，就会将物理像素减少到540 x 960，这样就会得到一个看起来更加适合的元素尺寸。

/* 在标签中引入以下meta标签 */

然而，只是将视口缩放到0.5并不是最佳选择。这是因为并非所有的手机都有相同的分辨率。如果我们使用太小的尺寸，会将高分辨率手机的屏幕利用率浪费掉。因此，更好的选择是使用媒体查询，根据手机的分辨率来为元素设置正确的尺寸。

/* 在CSS样式表中使用以下代码 */
@media (min-width: 750px) {
/* 750是iPhone6Plus的分辨率，为iPhone7Plus的0.5倍 */
/* 在这里编写适合iPhone6Plus的样式 */
}
@media (min-width: 1080px) {
/* 在这里编写适合iPhone7Plus的样式 */
}

总之，手持设备的高分辨率屏幕带来了前端开发人员的新问题，但是解决这个问题也不是很难。我们可以通过适当缩放视口或使用媒体查询，为不同的设备设置不同的尺寸，以使得在所有高分辨率设备上元素看起来都是适合的。