gpt4 book ai didi

html - 折叠到一列时如何让右侧的 div 落在 Foundation 中的左侧 div 之上

转载 作者:太空宇宙 更新时间:2023-11-04 14:40:48 27 4
gpt4 key购买 nike

我正在 Zurb 的 Foundation 4 中构建一个站点。我有一个包含两列的行。左栏是段落,右栏是图像。当我将浏览器缩小到移动尺寸以便布局折叠成一列时,我希望右侧的 div(图像)在转换为一列时位于左侧的 div(段落)之上。

默认情况下,图像将位于段落下方,因为 div 在顺序中靠后。

谢谢!

最佳答案

Foundation 有 pushpull 类,您可以使用它。在您的情况下,您可以将其设置为:

<div class="row">
<div class="large-6 push-6 columns">Image</div>
<div class="large-6 pull-6 columns">Text from paragraph</div>
</div>

您可以通过查看 http://foundation.zurb.com/docs/components/grid.html 上的文档了解更多信息。并查找“来源排序

关于html - 折叠到一列时如何让右侧的 div 落在 Foundation 中的左侧 div 之上,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18360232/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com