html - Bootstrap 布局在行中有边距

Question

尝试在 Bootstrap 中创建布局时，我发现了一个不容易解决的问题。我正在尝试用嵌套的行制作一行，但它们之间有一个间距。没有间距布局是美丽的，但是当你添加边距布局中断!

我正在尝试做的事情:

我尝试得到的结果:

   <div class="block">
        <div class="row">
            <div class="block_header">
                <b>Núcleo Regional da Diretoria de Araguaína</b><br>
                (mock,  mock,  mock,  mock,  mock,  mock,  mock)
            </div>

            <div class="block_subheader">
                <b>Plantão</b>
            </div>


            <div class="col-md-4 info">
                Defensor Público:<br>
                <b>Fabricio Silva Brito</b><br>
                Servidor:<br>

            </div>

            <div class="col-md-4 info">
                Período                
            </div>

            <div class="col-md-4 info">
                Telefone
            </div>
            <div class="col-md-4 info">
                Início 07/03 as 18h00<br>
                Término 07/03 as 18h00
            </div>

            <div class="col-md-4 info">
                (92) 3232-3232
            </div> 

        </div>




    </div>

http://jsfiddle.net/ywJ7k/1/

如何解决？

Answer 1

您可以尝试使用表格，然后您将在 HTML 中使用 cellspacing 调整空间。但是您需要更改所有 HTML:

<table cellspacing="3">
  <tr>
    <th colspan="3">Plantão</th>
  </tr>
  <tr>
    <td rowspan="2">
        Defensor Público:<br>
                <b>Fabricio Silva Brito</b><br>
                Servidor:<br>
    </td>
    <td>Período</td>
    <td>Telefone</td>
  </tr>
  <tr>
    <td>
        Início 07/03 as 18h00<br>
        Término 07/03 as 18h00
    </td>
    <td>
        (92) 3232-3232
    </td>
  </tr>
</table>

可以看到this JSFiddle例如。

希望对您有所帮助!