Скорее замечание, чем вопрос.
Начал изучать курс Bootstrap и на уроке 2.4 Grid System преподаватель дает видимо устаревший материал, потому как в документации Bootstrap другие данные касаемо префиксов класса самой сетки. Из-за этого не получается правильно решить следующее задание.
Код HTML:
<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<title>Bootstrap Grid System</title>
<!-- Подключаем Bootstrap CSS через CDN -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!-- Подключаем style.css -->
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container">
<div class="col-md-8 col-xs-12 col-sm-12 color-left-block">
<h3>Left block</h3>
</div>
<div class="col-md-4 col-xs-12 col-sm-12 color-right-block">
<h3>Right block</h3>
</div>
</div>
<!-- Подключаем jQuery и Bootstrap JS через CDN -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</body>
Код CSS:
.color-left-block {
background-color: #2b303b;
color: white;
}
.color-right-block {
background-color: rgb(56, 7, 89);
color: white;
}
Видимо, у вас просто новая версия Bootstrap, и там всё по другому.
Я как раз столкнулся с необходимостью разметки сетки через bootstrap и начал изучать курс. На сайе самого бутстрапа в документации указано что классы .col- .col-sm- .col-md- .col-lg- .col-xl- .col-xxl- немного отличаются от тех, которые преподаватель дает в уроке. В частности в уроке 2.4 он показывает слайд на котором указан размер класса col-md в 992px, а в дументации бутстрапа этот класс равняется 768px, а класс col-lg теперь 992px. Ну вот я не задумываясь и указал в ответе класс col-lg, и это оказалось ошибкой. Сначала не понял в чем проблема и пересмотрел урок, надо отвечать как в уроке.
Не страшно, главное что курс очень хороший и доступно все объясняется. Спасибо вам за такие курсы, а эти ошибки, это мелочи, их можно будет потом самому для себя изменить.
Еще раз спасибо вам и вашей команде за курсы!!! Будем изучать дальше :)
Максим, в первом уроке данного курса по Bootstrap - под уроком смотрите ссылку для установки версии Bootstrap для обучения (ver.3.3.7). А также по этой ссылке будет документация, соответствующая данной версии и урокам курса.
Рекомендуется проходить обучение и задания на этой версии, а далее перейти на новую. В следующих курсах, например, в больших курсах Веб-разработчик и Верстальщик будет рассматриваться Bootstrap в версиях 4-5.
Хорошо, спасибо, буду иметь ввиду. Так как я пока начинающий веб-разработчик, то не знал что версии bootstrap могут так сильно отличаться друг от друга. Спасибо!
