Уроки Bootstrap

#5 - Работа с таблицами в Bootstrap

#5 - Работа с таблицами в Bootstrap

Благодаря фреймворку Bootstrap мы можем работать с таблицами, добавлять им различные стили, а также эффекты. В этом уроке мы с вами будем как раз работать с таблицами при помощи Bootstrap.

Видеоурок

Исходный код

Весь код будет доступен после подписки на проект!

Онлайн редактор кода

Загрузка...

Задание к уроку

Работа с таблицами
Вам необходимо создать табличку и добавить различные стили к этой таблице. К примеру, ваша таблица должна быть в контейнере с фиксированной шириной, а также быть адаптивной. При наведении на поля они должны подсвечиваться. Не надо чтобы были видны границы у таблицы.
Посмотреть ответ
Ваша таблица может выглядеть следующим образом:
<div class="table-responsive container">
    <table class="table table-hover">
      <thead>
        <tr>
          <th>Сайт</th>
          <th>Домен</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td class="success">Программирование</td>
          <td class="info"><a href="https://itproger.com">https://itproger.com</a></td>
        </tr>
        <tr>
          <td class="warning">Информационное агенство</td>
          <td><a href="http://plurrimi.com">http://plurrimi.com</a></td>
        </tr>
      </tbody>
    </table>
</div>

Большое задание по курсу

Вам необходимо оформить подписку на сайте, чтобы иметь доступ ко всем большим заданиям. В задание входит методика решения, а также готовый проект с ответом к заданию.
PS: подобные задания доступны при подписке от 1 месяца

Также стоит посмотреть

Вёрстка адаптивного сайта на Bootstrap 4
6 уроков
Видеокурс по PHP, MySQL / Создание динамического сайта
Уроки Python Django / Создание сайта
12 уроков
Современная вёрстка адаптивного веб-сайта
Создание блога на Ruby On Rails
8 уроков