Question

过去几个小时我一直试图解决这个问题，但找不到任何解决方案。我有四张照片要用作照片库缩略图。我希望其中两张图片位于顶部，其中两张位于底部，两者之间没有间隙或空白区域。此外，我希望所有这四张图片在窗口大小改变时调整大小，以便它们始终覆盖整个屏幕。这可能吗？在我这样做之后，我还会在左边添加一个菜单栏。任何帮助将不胜感激。

到目前为止我已经走了多远; jsfiddle

HTML：

<div class="menu">
<ul>
    <li><img src="image1" /></li>
    <li><img src="image1" /></li>
    <li><img src="image1" /></li>
    <li><img src="image1" /></li>
</ul>

CSS：

.menu {
    width: 100%;
    height: auto;
    margin-top: 0px;
    padding-top: 0px;
}

ul li {
    float: left;
    display: inline ;
    list-style: none;
    margin: 0px;
    padding: 0px;
}

谢谢，

Ilker

Answer 1

要删除空格，只需添加：

ul li{
..
line-heigth: 0;
..
}

要调整大小前两张图片，请为其他人提供width: 50%;，然后width: 100%;。

如果这不是您要找的答案，请提供有关尺寸问题的详细信息。

如何用窗口更改图库缩略图的大小？

1 个答案: