html - 两个 div 并排，但如果屏幕太小，则强制右侧 div 保持在左侧 div 上方

Question

问题标题几乎概括了这一点。我想知道是否可以像这样并排放置两个 div:

DIV #1 |分区 #2

但是如果屏幕太小(例如在移动设备上)，我希望发生这种情况:

DIV #2

DIV #1

也就是说，DIV #1 而不是 DIV #2 向下滑动

干杯，本。

Answer 1

您可能使用 float 让 div 彼此相邻。当屏幕太小时，使用@media-queries 来改变这个行为。在您的 CSS 文件中:

@media only screen and (max-width: 480px) {
    /* when window size is below 480px */
    div {
        float: none;
    }
}

这只是一个示例，如果窗口大小小于 480px，将 float:none 设置为您网站上的所有 div；调整它以实现你想要的:)