Как сделать маленькую таблицу на бутстрапе для десктопа и мобильного?

Для создания маленькой таблицы на Bootstrap, которая будет адаптивной для десктопа и мобильных устройств, мы можем использовать CSS-классы Bootstrap и некоторые дополнительные стили.

1. Создаем таблицу с помощью HTML:

<table class="table table-sm">
  <thead>
    <tr>
      <th>Заголовок 1</th>
      <th>Заголовок 2</th>
      <th>Заголовок 3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Ячейка 1</td>
      <td>Ячейка 2</td>
      <td>Ячейка 3</td>
    </tr>
    <tr>
      <td>Ячейка 4</td>
      <td>Ячейка 5</td>
      <td>Ячейка 6</td>
    </tr>
  </tbody>
</table>

2. Добавляем класс table-sm к таблице. Он установит меньший размер для таблицы.

3. Чтобы таблица была адаптивной для мобильных устройств, мы можем обернуть таблицу в контейнер с классом table-responsive. Это позволит таблице горизонтально прокручиваться на маленьких экранах.

<div class="table-responsive">
  <table class="table table-sm">
    <!-- таблица -->
  </table>
</div>

4. Мы также можем добавить дополнительные стили, например, установить фиксированную ширину таблицы или изменить цвет фона ячеек. Это зависит от ваших требований и дизайна.

Например, мы можем добавить класс table-striped для добавления полосатого фона:

<table class="table table-sm table-striped">
  <!-- таблица -->
</table>

Исходя из вашего вопроса, это основные шаги для создания маленькой адаптивной таблицы на Bootstrap, которая будет отлично выглядеть как на десктопе, так и на мобильных устройствах.