640px PSD文件需要在所有设备中修复

在寻找解决方案很长一段时间后,我发现你可以使用

<meta name="viewport" content="width=640">

让浏览器为您做其他工作。这是我在apple.com上找到的。只需查看来源 http://www.apple.com

我不认为你可以使用css来“裁剪”,除非有一种“黑客”的方法。

但使用媒体查询,您可以很容易地调整其大小以适应您的浏览器:

<script>
      <link rel="stylesheet" href="css/largeres.css" media="screen and (min-width: 1236px)" > 

      <link rel="stylesheet" href="css/mediumres.css" type="text/css" media="screen and (max-width: 720px)">

      <link rel="stylesheet" href="css/smallres.css" type="text/css" media="screen and (max-width: 360px)">
</script>

smallres.css

yourImage{
    height: 60%;
    width: 60%;

}

介质.css

yourImage{
    height: 80%;
    width: 80%;

}

大号.css

yourImage{
    height: 100%;
    width: 100%;

}

您可以将其设置为背景图像并使用 background-size: cover 为您展开,了解更多信息 see here ,以及演示 here (试着调整浏览器窗口的大小以查看它的运行情况)。

不幸的是,因为这是一个CSS3属性IE8,下面的属性不支持它,所以你可以使用过滤器(第一个链接有更多关于它的信息)来克服这个问题,或者你可以选择一个涉及JavaScript的更复杂的解决方案。

媒体查询也是一种可能的解决方案,但恐怕我对此了解不多,你可以很好地指出,新智能手机的屏幕(技术上)宽度超过1000像素。

我相信有一种方法可以解决使用媒体查询的问题,可能是使用手持设备而不是媒体?我不完全确定,但如果你想探索更多,我相信谷歌会是你的朋友。