使用bootstrap实现细粒度宽度

Question

使用bootstrap，我认为col宽度在某些情况下不够精细。这是一个非常好的模板，我试图模仿学习目的：

现在，这是我的尝试：

它还处于早期阶段，但这些宽度已经不适合我。两个按钮之间的差距太宽，而且很笨拙。

<div class="mobile-menu btn-group col-xs-12">
    <button class="btn btn-default btn-lg dropdown-toggle col-xs-12" type="button" data-toggle="dropdown">
        Large button <span class="caret"></span>
    </button>

    <ul class="dropdown-menu col-xs-6">
        <li> Item One </li>
        <li> Item Two </li>
        <li> Item Three </li>
        <li> Item Four </li>
        <li> Item Five </li>
    </ul>
</div>



<div class = 'col-xs-6'>
    <a class = 'btn btn-primary col-xs-12'> Make a Donation </a>
</div>

<div class = 'col-xs-6'>
    <a class = 'btn btn-primary col-xs-12'> Make a Donation </a>
</div>

如何实现更精细的控制？正如你所见，我试图嵌套按钮，但这没有做任何事情。

Answer 1

你可以在这里调整你喜欢的任何东西。添加更多列，减少列之间的空间等。

http://getbootstrap.com/customize/

Answer 2

正如MightySchmoePong指出的那样，您可以自定义和下载它。我还发现firefox Developer工具/控制台等都是在bootstrap使用中实现更精细控制的不可或缺的工具。在Developer工具的帮助下识别出与之相交的特定元素后，您可以通过为其编写自定义LESS或CSS，轻松地将此元素定位到您的需求。