Bootstrap

Изучение технологии Bootstrap (верстка сайта)

16 уроков 20 заданий Справочник Компилятор

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

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


BootstrapHTML5

Благодаря фреймворку 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 месяца!


BootstrapHTML5

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