CSS在同一列上有img，但不同行
阿里贾尔
我从3天开始就处于这种情况，但我的问题没有得到任何答案：如何在列上具有相同宽度的div（包含宽度为320px的图像）（完成）但不能按行组织？
让我加入一个小草图来解释一下：在左边，这就是我的意思。在右边，这就是我想要的。（当减小屏幕/导航器的宽度时，第二行用于“媒体屏幕”：因此，将4到3改成2到1（反之亦然）。请注意盒子的数量）：
为了说明如何获得此正确的部分，下面是代码：
的HTML：
<div class="box">
<a href="#"><img src="#" alt=""/></a>
</div>
只需继承此类，就可以直接放在身体上。这个盒子很重要，因为也许我必须要有标题或其他东西。
CSS：
.box {
position: relative;
float: left;
min-width: 340px;
max-width: 24.80%;
width: 24.79%;
margin: 20px 0px 20px 0px;
}
@media only screen and (max-width: 1800px) {
.box {
min-width: 360px;
max-width: 33%;
width: 33%;
}
}
要完成此问题，这里有一个限制：它必须是动态且通用的（这样，我只需要制作一个div的副本并替换图像的链接（即在添加php和js之前），或添加我想要的任何东西）。
德文
您应该查看jQuery Masonry（http://masonry.desandro.com），它确实满足您的需求。
如果由于某种原因而无法使用砌筑，则应首先将页面分成几列。然后在每列中堆叠div框。
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
在一列上有不同结果
- 2
在一列上有不同结果
- 3
熊猫：如何从同一列但不同行填写值
- 4
从Power Bi中同一列但不同行中减去值
- 5
SQLServer-同一列上有多个PIVOT
- 6
同一列上有多个SQL过滤器
- 7
如何在具有不同行的一列上插入多个值？
- 8
在同一列上有多个索引的情况下，Oracle中的索引选择行为
- 9
如何在Access 2016的另一列上选择具有最大值的不同行
- 10
如何在同一列上找到具有多个不同值的结果？
- 11
检查“行”中是否存在“单元格”值，并在同一列但不同行中返回一个值
- 12
我怎样才能在一列上有一个 group_by，在另一列上有一个 order_by，在第三个不同的列上有一个过滤器？
- 13
如何比较来自同一列的不同列和不同行的值？
- 14
Codeigniter活动查询：多个更新同一列不同行不同的位置ID
- 15
如何在Tkinter中使同一列上的两个小部件具有不同的宽度？
- 16
SQL Server：在一列上有多个选择语句
- 17
删除在另一列上有特定ID的行组
- 18
MySQL中不同行中同一列的值的XOR
- 19
R DF引用同一列中的2个不同行（返回）
- 20
如何在数据框的同一列的不同行中的集合之间执行联合
- 21
MySQL中不同行中同一列的值的XOR
- 22
获取同一列多行的总值和两个不同行的总和（mysql查询）
- 23
如何将来自同一列但位于不同行的两个值相除
- 24
不同行数据相等时如何在同一列中选择正确的日期
- 25
仅在一列上不同
- 26
在bigquery的同一列上应用不同的条件
- 27
如何在不同时间在同一列上存储 2 条记录？
- 28
选择具有不同AS的同一列
- 29
获取具有不同条件的同一列的总和
我来说两句