Введение 0:07 В студии московской школы программистов начинается занятие по теме "фол стек разработчик". Сегодняшняя тема - блочная модель, которая будет изучена на занятии.
Цели занятия 2:04 Изменение размера элементов на странице. Изучение разных способов изменения размеров элементов. Изучение способов настройки расстояния между элементами. Добавление границ для блоков. Превращение квадрата в круг.
Разбор домашнего задания 4:51 Обсуждение домашнего задания в чате. Ответы на вопросы по домашнему заданию.
Заключение 5:51 Упоминание о следующем занятии, где будут показаны проекты. Переход к разбору домашнего задания.
Разбор тестирования 8:40 Преподаватель обсуждает результаты тестирования и объясняет, что у некоторых учеников баллы не соответствуют оценкам. Упоминает, что возможно это связано с тем, что баллы учитываются вместе с дзехой.
Селекторы CSS 10:27 Преподаватель объясняет, что такое селектор и как он используется в CSS. Обсуждает различные типы селекторов и их применение.
Цвета и шрифты 14:41 Преподаватель объясняет, как задавать цвета и шрифты для элементов HTML. Упоминает о том, что некоторые элементы могут быть строчными или блочными.
Завершение разбора тестирования 18:43 Преподаватель завершает разбор тестирования и переходит к новой теории. Обсуждает блочную модель, ширину и высоту блоков, а также изменение состояния блоков.
Размеры элементов 23:12 В видео обсуждаются размеры элементов на странице, которые можно задавать с помощью атрибута "white" или свойства "white-space". Блочные элементы занимают всю ширину родительского блока, а их высота определяется контентом.
Эксперименты с размерами 24:55 В примере с параграфом, можно задать размеры с помощью свойств "white" и "height". Высота может быть указана в процентах, если высота родительского блока указана в пикселях. Если высота блока задана в процентах, а высота родительского блока автоматическая, то высота блока не изменится.
Контент оверфлоу и пиксели 28:47 Если высота блока задана в пикселях, а контент внутри блока больше, то возникает ситуация "контент оверфлоу". Это может произойти с любым параграфом, если задать ему фиксированную высоту, меньшую, чем наполнение. Важно избегать таких ситуаций и бороться с ними.
Блочные и строчные элементы 30:35 Обсуждение использования классов и тэгов для стилизации блоков текста. Объяснение, что срочные элементы не могут задавать себе ширину и высоту, но срочные блочные элементы могут.
Полукровка - срочно блочный элемент 37:37 Объяснение, что полукровка - это элемент, который совмещает преимущества строчных и блочных элементов. Позволяет задавать себе ширину и высоту и дружит с соседями.
Практика 40:40 Разделение на подгруппы для выполнения задания в информатисе. Обещание супер крутой практики, похожей на реальные проекты.
Блочная модель 1:03:31 Видео объясняет блочную модель, которая состоит из замка, отступов, стен и крокодилов. Обсуждаются свойства элементов, такие как размеры, границы, отступы и бэкграунд.
Границы и закругление элементов 1:08:08 Объясняется свойство "border radius", которое позволяет скруглить элементы. Обсуждается использование прерывистых границ и бэкграунда.
Отступы и марджины 1:10:53 Отступы и марджины влияют на размеры элементов и их визуальный вид. Строчные элементы не рекомендуется использовать для блочной модели.
Практика 1:15:32 Видео переходит к практике, где обсуждаются два задания: одно попроще, другое посложнее.
Завершение курса 1:31:44 Преподаватель обещает разобрать последнее задание частично на следующем занятии и добавить кусочек верстки для практики. Он также упоминает о консультации через пару занятий, где можно будет доделать все, что не успели.
Магический круг и интернет-магазины 1:33:35 Преподаватель объясняет, что магического круга нет, но есть обычный бублик, который можно сжимать. В следующих занятиях будут рассмотрены интернет-магазины и сервисы, такие как Авито.
Завершение занятия 1:34:34 Преподаватель желает удачи, сил и внутреннего запала, призывает задавать вопросы на следующих занятиях или в информати. Завершает занятие, прощается и благодарит за внимание.
