Question

有人告诉我，块网格会在网格内均匀分隔项目。我是否需要在最后一个li元素中添加“.last”或其他内容才能使它们均匀分布？因为这不是均匀间隔，http://i.imgur.com/QM0Gduz.png。您可以在下面看到哪个边框属于哪个元素。

这是正文部分中唯一的HTML。使用最新版本。

<div class="row">
    <div class="large-12 column" style="border: 1px solid red;">
        <ul class="large-block-grid-4" style="border: 1px solid black;">
            <li><img src="http://placehold.it/150" /></li>
            <li><img src="http://placehold.it/150" /></li>
            <li><img src="http://placehold.it/150" /></li>
            <li style="border: 1px solid blue;"><img src="http://placehold.it/150" /></li>
        </ul>
    </div>
</div>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="js/foundation.min.js"></script>
<script>
    $(document).foundation();
</script>

Answer 1

只需在主行中添加text-align:center;，并确保通过在中/小/超小型设备中添加网格尺寸来提供响应能力。 Zurb / Bootstrap专为响应式设备而构建，这意味着创建响应式网站应该很容易。查看下面的JSFiddle以更好地了解我在说什么。

<强> DEMO

基础块网格未正确间距

1 个答案: