Html ul内部的响应性设计图像，不'；t调整大小

我有一个无序的图像列表，在一个响应的设计。当我调整窗口大小时，图像可以正确缩放。但问题是包装UL元素，它不能根据图像高度调整其高度。这将在跟随P元素之前创建一个大gab

---

如何实现

ul

元素的高度，以便在不浮动

li

的情况下进行相应调整

首先，无论何时进行响应式设计，请确保使用以下代码段

* {
  margin: 0;
  padding: 0;
  -moz-box-sizing: border-box; 
  -webkit-box-sizing: border-box; 
  box-sizing: border-box;
}

如果您知道CSS框模型，上面的操作将与此完全相反，它将计算元素内部的

填充

，

边框

，而不是元素外部的

现在来看解决方案，您使用的是
列计数
属性，我认为这在您的情况下不是必需的，您只需使用
float:left然后使用
溢出：隐藏
清除浮动的
li


如果您想去除底部剩余的粉红色部分，请使用。（准确地说，使用
宽度：33.33%
，这将去除右侧的粉红色。）

（带间隙，使用
填充
）

另外，在我编辑问题时，您提到您不想浮动，因此我看不出不这样做的任何具体原因，但如果您不想浮动，您可以使用
显示：内联块宽度设置为
33%
时，还要确保使用
左边距：-4px
通过使
li
元素
内联块
来处理
空白
，
最后我放弃了使用列的想法，用传统的（li）向左浮动的方式进行计算。是的，我知道盒子的尺寸，但你们的使用左边距：-4px，因为li内联块对我来说是新的。另外字体大小：0，是我不会使用的，因为我总是使用em而不是px来处理fontsize，所以这将使计算更加困难。最后，我想我会尽我所能。HTML来自我正在使用的CMS。@tenzin很酷，您可以使用任何适合您需要的方法：）