cuốn sách gpt4 ai đã làm

html - 中型和大型设备上为 2 x 2 矩阵,小型设备上为 4 x 1 矩阵

In lại Tác giả: Walker 123 更新时间:2023-11-28 14:27:14 29 4
mua khóa gpt4 Nike

我想知道如何获得下面的布局。

在中型和大型设备上,我希望有 2 行和 2 列的布局(2 x 2 矩阵)。

在小型(和超小型)设备上或调整为小型设备时,我想要一个 4 行和 1 列的矩阵。

我将通过 ascii 对其进行说明。

1) 2 x 2 矩阵(中型和大型):

(b1) (b2)
____________

r1c1 r1c2
r2c1 r2c2

2) 4 x 1 矩阵(小和超小):

(b1)
r1c1
r2c1
(b2)
r1c2
r2c2

这里重要的是,在调整为小的时候按 block 合并列和行。在这种情况下,一个 block 由每列两行组成。这由 (b1)、(b2) 表示。

这种逻辑应该可以扩展到多行和多列。

我可能找错了树。

一般来说,我希望在图片下方网格对齐文本。在 block 中,第一行始终是图像,第二行始终是对齐的文本。

那么如何克服呢?

câu trả lời hay nhất

如果我正确理解您的问题,最简单的解决方案是为每一列添加订单类。在不同尺寸、PC 和移动设备上查看下面的代码片段,看看布局和顺序的差异。

biên tập:我按照您的要求在小屏幕上添加了边距。

/*DEMO PURPOSE*/.col-md-6{border:1px red solid;padding:2rem}




Row 1 Col 1

Row 1 Col 2

Row 2 Col 1

Row 2 Col 2


关于html - 中型和大型设备上为 2 x 2 矩阵,小型设备上为 4 x 1 矩阵,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54526415/

29 4 0
Chứng chỉ ICP Bắc Kinh số 000000
Hợp tác quảng cáo: 1813099741@qq.com 6ren.com
Xem sitemap của VNExpress