仅使用CSS的自适应html布局

Question

我认为这是我关于自适应HTML / CSS布局的第二篇文章。我在上一篇文章中得到了一个有用的答案，我在其中实现了自适应布局，在我需要移除浮动并将容器放在另一个之下时更加直接。

这次我有一些复杂的设计。让我展示设计应该如何在横向和纵向模式下观看。

景观设计：

在纵向模式下，如果宽度小于1024px，那么设计应该看起来像这样

人像设计：！

如果有人指导我如何处理此设计，将会有所帮助。如果需要更多信息，请随时询问

由于 Raaks

Answer 1

您可以尝试使用媒体查询

@media all and (max-width: 1023px) {
  /* CSS you need for portrait */
}

您可以阅读很多关于“响应式网页设计”的好文章。