【问题标题】:Maintain site width when rotating to landscape or using on larger displays旋转到横向或在更大的显示器上使用时保持站点宽度
【发布时间】:2026-02-12 21:10:01
【问题描述】:

我有一个移动网站,可以在纵向模式下在手机和小型平板电脑上正常运行。

http://taviationmuseum.appspot.com/

该网站在横向模式下运行良好,但由于图像的性质,缩放看起来并不理想。

相反,我想大致保持站点纵向的宽度,并在任一站点上用空格将内容“居中”。

最好的方法是什么?

【问题讨论】:

    标签: css scaling viewport


    【解决方案1】:

    首先,您现在可以使用640*905以最大分辨率重新切片您的这张图片front-spread.jpg,所以现在如果我们在更大的屏幕上查看它会延迟像素。 因此,如果您将根据各种屏幕尺寸以最大值重新切片并设置media-queries,它将根据您的要求自动调整..

    【讨论】:

    • 这听起来很完美。我是媒体查询的新手,您能否提供一些关于如何实现这一点的更多细节?
    • 嘿,chambo,你可以看到链接:- css-tricks.com/snippets/css/media-queries-for-standard-devices
    • 您可以通过媒体查询为单独的屏幕分辨率编写单独的 CSS .....
    • chambo 你也可以阅读这篇文章:- webdesign.tutsplus.com/tutorials/htmlcss-tutorials/…
    • 谢谢,我会试试这些。作为开始,我将为超过 720 像素的屏幕编写新的 CSS——这将考虑到新智能手机上的横向模式和大多数平板电脑上的横向/纵向模式