в bootstrap 3, как изменить расстояние между рядами по вертикали?

<p>у меня есть два ряда a и b, я думаю, что расстояние между двумя рядами по вертикали слишком мало.</p><p>я хочу сделать расстояние больше, я знаю, что могу изменить расстояние по горизонтали на col-md-offset - *. но как изменить расстояние по вертикали?</p><pre><code> <div class="row" id="a"> <img> ... </img> <div> <div class="row" id="b"> <button>..</button> <div> </code></pre><p>теперь мое решение - вставить тег h1, я думаю, что это не изящно.</p><pre><code> <div class="row" id="a"> <img> ... </img> <div> <h1></h1> <div class="row" id="b"> <button>..</button> <div> </code></pre><p>есть ли у него более изящное решение?</p>

<p>вместо добавления любого тега, который никогда не является хорошим решением. вы всегда можете использовать свойство <code>margin</code> с обязательным элементом. </p><p>вы можете добавить поле для самого класса строк. так что это повлияет на глобальном уровне.</p><pre><code>.row{ margin-top: 30px; margin-bottom: 30px } </code></pre><p><strong> обновление </strong>: <em>во всех случаях лучшим решением было бы ввести новый класс, а затем использовать его вместе с классом <code>.row</code></em>.</p><pre><code>.row-m-t{ margin-top : 20px } </code></pre><p>тогда используйте его где хотите</p><pre><code><div class="row row-m-t"></div> </code></pre>

<p>использовать:</p><pre><code><div class="row form-group"></div> </code></pre>

<p>если бы это был я, я бы представил новый класс css и использовал бы вместе с немодифицированным классом строки начальной загрузки.</p><p>html</p><pre><code><div class="row extra-bottom-padding" id="a"> <img>...</img> <div> <div class="row" id="b"> <button>..</button> <div> </code></pre><p>css</p><pre><code>.row.extra-bottom-padding{ margin-bottom: 20px; } </code></pre>

<p>если вы используете sass, это то, что я обычно делаю.</p><pre><code>$margins: (xs: 0.5rem, sm: 1rem, md: 1.5rem, lg: 2rem, xl: 2.5rem); @each $name, $value in $margins { .margin-top-#{$name} { margin-top: $value; } .margin-bottom-#{$name} { margin-bottom: $value; } } </code></pre><p>так что вы можете позже использовать <code>margin-top-xs</code> например</p>