lec 3 done
This commit is contained in:
@@ -10,6 +10,7 @@
|
||||
2. написать свой продублировав страничку с картинки
|
||||
|
||||
## 2 CSS
|
||||
|
||||
### p1
|
||||
Описание синтаксиса, правил форматирования, процесс применения селекторов, приоретизация стилей
|
||||
id > class >tag
|
||||
@@ -54,7 +55,6 @@ id > class >tag
|
||||
Информация про гриды, начиная про определение и общие атрибуты
|
||||
рассказывается про еденицы размеров ячейки (fr) про repeat и про min-max, и заканчивается обзор формированием зон в таблицах и установкой позиций элементов вне зависимости от положения тэга в дереве
|
||||
|
||||
|
||||
## 3 Bootstrap
|
||||
Определение фреймворка, примеры того как им пользоваиться
|
||||
описание 12 колоночной вёрстки и связанных с ней предварительно готовых классо, концепция контрольныз точек (sm md ls xl xxl).
|
||||
@@ -62,9 +62,41 @@ id > class >tag
|
||||
так-же немного расказано о внутрянке самого фрейморка (контейнеры построены на flex) и опять-же про аналог алинга айтемов как в гридах или флексе.
|
||||
В Bootstrap существует три уровня: базовый (контейнеры и сетка), компоненты (кнопки, формы, карточки) и утилиты (классы для быстрого изменения внешнего вида). Так-же описывается создание атомарных классов и можификаторов цветов...
|
||||
|
||||
|
||||
|
||||
задачи:
|
||||
1. задача на чекпоинты и их понимание
|
||||
2. применение разных дисплеев
|
||||
3. задача на align и чекпоинты
|
||||
|
||||
## 3 Препроцессоры
|
||||
|
||||
### p1 - Методологии вёрстки
|
||||
Лекция в основном про БЭМ (блок__элемент--модификатор), про принцип называния блоков по смыслу того что они делают. Кроме этого обозреваются другие методолгии (SMACSS\ECSS)
|
||||
|
||||
задачи:
|
||||
1. задача на вёрстку по БЭМ ( похоже тут старая версия, расходится с тем, что я писал на лекции, то что писал и показывал на лекции было утеряно в одной из веток гита ... )
|
||||
|
||||
### p2 - препорцессоры HTML
|
||||
|
||||
Идея препроцессоров - инструмент преобразующий код из одного вида в другой в рамках однго языка, используется для сокращения кода который пишет разработчик и для упрощения жизни в целом.
|
||||
в лекции упомянуты несколько препроцессоров, но основной фокус идёт на pug (JADE), далее речь в основном о нём
|
||||
Вся лекция в целом описывает работу , начиная от создания структуры и комментариями и заканчивая атрибутами и разными нюансами, далее основаня информация в названии задач.
|
||||
после всех задач была рассмотрена концепция шаблонов для упрощеня создания повторяющихся страниц
|
||||
|
||||
задачи:
|
||||
1. базовая структура + атрибуры
|
||||
2. структура атрибуты shothand для классов
|
||||
3. переменные, инкрементация и подстановка текста
|
||||
4. each, подстановка занчений по рано
|
||||
5. циклы, вложенность?
|
||||
6. mixin - местный аналог макроса из C
|
||||
|
||||
### p3 - препроцессоры CSS
|
||||
Упомянуто несолкьо препроцессоров, фокус на stylus.
|
||||
в целом содержание лекции видно в задачах
|
||||
хотя в заданиях не затрагивался момент с возвращением значениев из миксинов, но всё равно инетересно
|
||||
задачи:
|
||||
1. переменные
|
||||
2. вложенность
|
||||
3. опять вложенность и на осознание принципов компиляции и частичных ссылок
|
||||
4. миксины и вложенность
|
||||
5. миксины и выисление
|
||||
|
||||
Reference in New Issue
Block a user