如何创建没有间距/填充的图片网格？ （WordPress的）

Question

我正在一个WordPress网站上工作，无论我多努力，我都无法弄明白。我希望有一个类似于此的网格（http://www.elegantthemes.com/gallery/origin/），但更像是这样：（http://themeforest.net/item/hercules-portfolio-business-wordpress-theme/full_screen_preview/5124743）。您将看到在大力神主题中，网格仅位于页面顶部。我想做一些类似于页面中间的东西。不幸的是我不能切换主题来获得那个功能。所以我想知道如何创建自己的版本。有人能指出我正确的方向吗？

P.S。网格不需要任何花哨的缩放动画，甚至不必是可链接的。只是像4x2网格中那样的静态图片。图像之间没有间距或填充或边距。我联系了那个主题的设计师，他提到它不是一个插件。这是自定义CSS3。尽管如此，他没有任何帮助：/

Answer 1

我使用无序列表来包含图像，浮动列表项并应用25％的宽度。然后，图像需要100％宽度，最大宽度100％和高度：自动a用于响应式布局。您上传的图片需要具有相同的高度尺寸（或者您可以在列表项上设置固定的高度，但可能会丢失一些图像内容。）

ul#picture_grid {

list-style: none;
width: 100%;
overflow: hidden;

}

#picture_grid li {

float: left;
width: 25%;

}

#picture_grid img {

display: block;
width: 100%;
max-width: 100%;
height: auto;

}