响应式设计CSS样式，可欣赏风景

Question

我知道这听起来很愚蠢，但是我已经搜索了stackoverflow，并且讨论了大多数有关iPhone从纵向切换为横向切换时视图切换错误的问题。

这是我的问题。我已经为iPhone设计了人像视图，我手动重新定义了大多数div的宽度。 该网站现在可以在纵向视图中正常工作。 现在，我将要开发横向视图，我只希望站点显示适合屏幕大小，并保持其在普通浏览器中显示的格式。 此视图的每个div不再需要单独的CSS样式表设计。 只是使它在普通浏览器中显示为相同格式，但要缩小到适合手机横向屏幕的大小即可，是否可以设置一些内容以使整个网站适合大小？

 @media screen and (min-device-width: 481px) and (orientation:landscape){

        //what can I put here to make the whole site fit into the landscape screen?

}

Answer 1

如果我没有误解您的问题，那么您首先需要一个视口

<meta name="viewport" content="width=device-width, initial-scale=1.0">

然后将包装器的宽度设置为100％，或尝试使用网格系统。