Question

<div class="row">
    <div class="span4">
        <h2>Cele mai vandute</h2>
    </div>
    <div class="span10 offset1 well">
        <ul class="thumbnails">
            <li class="span2">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </li>
            <li class="span2">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </li>
            <li class="span2">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </li>
            <li class="span2">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </li>
            <li class="span2">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </li>
            <li class="span2">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </li>
            <li class="span2">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </li>
            <li class="span2">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </li>
            <li class="span2">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </li>
            <li class="span2">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </li>
        </ul>
    </div>
</div>

您好我在bootstrap css中遇到麻烦，无法将此范围集中在容器类中。有人可以向我解释一下bootstrap中心是如何专门用于跨度的。非常感谢你

Answer 1

您已在bootstrap site中解释过它。

通常，您的span可能总和为12（直到您customize为止。）

此外，您使用<li>元素而不是<div>，这是引导程序用于网格的元素

一些调整您的代码：

<div class="row">
    <div class="span2">
        <h2>Cele mai vandute</h2>
    </div>
    <div class="span10">
        <div class="row">
            <div class="span1">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </div>
            <div class="span1">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </div>
            <div class="span1">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </div>
            <div class="span1">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </div>
            <div class="span1">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </div>
            <div class="span1">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </div>
            <div class="span1">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </div>
            <div class="span1">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </div>
            <div class="span1">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </div>
            <div class="span1">
                <a href="#" class="thumbnail"><img data-src="holder.js/200x100" alt=""></a>
            </div>
        </div>
    </div>
</div>

Answer 2

我使用ul和li代替div，因为在bootstrap网站上的例子中显示的是ul和li ..而不是div的每一行我可以总共12个，然后我需要再次在另一行上工作，最多12个？像这样：

<div class="row">
<span class="9">...</div>
<span class="3">...</div>
</div>
<div class="row">
<span class="9">...</div>
<span class="3">...</div>

css bootstrap twitter中心跨度

2 个答案: