html - 带图像的 CSS 固定侧菜单，换行

Question

我在我的页面上固定了一个位置 SIDEmenu。它包含 100 个小图像。每张图片大小为 10 像素 x 10 像素。

如何让图片垂直环绕？

我的意思是，如果浏览器高度为 500，那么它将在 2 列中显示图像，如果浏览器屏幕高度为 250，则为 4 列...就像垂直自动换行。

这可以使用 HTML 和 CSS 吗？

新增:=左侧固定菜单栏，100张小图。我试图让它在 iphone 和电脑上运行。图片用于浏览网站，因此每张图片都很重要。在 iphone 上，底部的图像被截断了，所以我想把它们包起来。所以基本上我需要在较小的屏幕上更宽的菜单以适应所有菜单图像

Answer 1

一种选择是使用 css3 的媒体查询:

@media (min-height:500px) and (max-height:1000px){
  #sidebar { width:20px; }
}

Here是我做的一个基本例子，你可以通过调整你的浏览器大小来尝试(当然，如果它支持 css3 媒体查询)