Как сделать отступы между блоками bootstrap

Аватар пользователя Ivan Gagarinov
Ivan Gagarinov
16 июля 2024

Для создания отступов можно использовать встроенные классы Bootstrap:

  • Для добавления внешних отступов между блоками можно использовать классы m- и mt-, mr-, mb-, ml-, mx-, my- для задания соответственно отступов со всех сторон, сверху, справа, снизу, слева, по горизонтали и по вертикали:

    <div class="container">
      <div class="row">
        <div class="col">
          <p>Контент первого блока</p>
        </div>
      </div>
      <div class="row">
        <div class="col">
          <p>Контент второго блока</p>
        </div>
      </div>
    </div>
    
  • Для добавления внутренних отступов в Bootstrap можно использовать классы p- и pt-, pr-, pb-, pl-, px-, py- для задания соответственно внутренних отступов со всех сторон, сверху, справа, снизу, слева, по горизонтали и по вертикали:

    <div class="container">
      <div class="row">
        <div class="col">
          <div class="card p-3">
            <p>Контент первого блока</p>
          </div>
        </div>
      </div>
      <div class="row">
        <div class="col">
          <div class="card p-3">
            <p>Контент второго блока</p>
          </div>
        </div>
      </div>
    </div>
    
0 0

Похожие вопросы