Введение 0:00 В видео автор приветствует зрителей и представляет себя в студии московской школы программистов. Он демонстрирует магию исчезновения и объясняет, что это одна из технологий, на которых держится весь веб-разработка.
Цели занятия 0:04 Главная цель занятия - научиться писать все СС правила и узнать, что такое СС. В дальнейшем планируется изучение установки фона для элементов и управления шрифтом текста.
Теория СС 0:05 СС отвечает за внешнюю составляющую сайта, стили и оформление. СС позволяет работать со шрифтами, цветом текста и фона, размером элементов, отступами и положением элементов на странице.
Практическая работа 0:06 Автор предлагает зрителям сделать проект и доделать его, если это необходимо. Он также напоминает о том, что не следует использовать кириллические символы и пробелы в именах файлов и папок.
Заключение 0:07 СС позволяет работать с различными элементами сайта, такими как шрифты, цвет, размер, отступы и положение элементов. Вскот - редактор, который будет использоваться на протяжении всего курса.
Анимации 8:17 Обсуждается анимация на сайтах, включая использование CSS-анимаций. Рассматриваются планы на будущие занятия, включая изучение библиотеки Bootstrap и изучение деталей CSS.
Структура проекта 10:15 Создается папка с CSS-файлами и обсуждается структура проекта. Обсуждается использование метатега для подключения CSS-файлов на страницу.
Вопросы и ответы 12:38 Задаются вопросы о подключении CSS-файлов на страницу и о метатеге. Ответы на вопросы даются в чате.
Введение в CSS 14:01 В этом видео мы рассмотрим синтаксис CSS и его использование для создания стилей для элементов на странице. Мы рассмотрим различные селекторы, такие как селектор по тэгу, селектор по классу и селектор по идентификатору.
Синтаксис CSS 15:53 Мы рассмотрим синтаксис CSS, который включает в себя использование фигурных скобок для указания свойств и значений. Мы также рассмотрим различные цветовые модели, такие как RGB, HEX и ключевые слова для цветов.
Практика с ассистентами 23:28 В этой части мы перейдем к практике с ассистентами и выполнению задания на пятнадцать минут. Мы продемонстрируем, как подключать стили и использовать различные селекторы и цветовые модели в CSS.
Демонстрация стилей 26:00 Автор демонстрирует, как применять стили в аштимель документе, создавая папку "все сс" и файл "индекс сс". Подключение файла к индексу html-документу с помощью тэкланк.
Применение стилей 28:57 Автор применяет стили к сайту лунного зоопарка, задавая цвет фона и текста. Использование ключевых цветов и свойств бэкграунд калар для стилизации.
Разбор задания 39:58 Автор разбирает задание по стилизации лунного зоопарка, стилизации темы сайта и задания цветов для текста и фона. Демонстрация стилизации тэгов и выделения текста.
Практика по типографике 47:48 Автор видео объясняет, что он занимался практикой и разбирал задания для тех, кто посмотрит видео. Он предлагает проверить свои знания в чате и задать вопросы, если что-то непонятно.
Типографические свойства 51:03 Автор объясняет свойства, которые используются для изменения шрифта и размера текста. Он упоминает, что не стоит использовать заголовки для увеличения размера шрифта, а использовать специальные свойства.
Декоративные свойства 54:30 Автор рассказывает о декоративных свойствах, таких как подчеркивание и зачеркивание текста. Он объясняет, что эти свойства можно использовать, но не обязательно запоминать их все.
Практика с использованием свойств 56:29 Автор демонстрирует, как использовать свойства на практике, например, для центрирования текста. Он предлагает пройти несложное тестирование на внимательность, чтобы проверить свои знания.
Магический эспандер 59:07 Автор демонстрирует магический эспандер, который позволяет ему видеть сквозь экран компьютера и использовать черную магию
Проверка на внимательность 1:00:06 Автор предлагает решить тест на внимательность, связанный с использованием свойств CSS
Виды селекторов 1:09:12 Автор объясняет виды селекторов, такие как селектор по тэгу, селектор по классу и селектор по айдишнику
Применение селекторов 1:10:09 Автор показывает, как использовать селекторы для стилизации элементов, таких как параграфы, списки и слова
Селектор пустышка 1:13:01 Автор объясняет, как использовать селектор пустышка для обращения к конкретным элементам и стилизации их по классу
Практика 1:14:52 Автор предлагает практиковаться в создании новой страницы с рецептом крабургера, используя CSS
Разбор задания для тех, кто не смог присутствовать на занятии 1:21:13 В видео проводится разбор задания для тех, кто не смог присутствовать на занятии. Обсуждаются различные элементы и классы, которые необходимо добавить в шаблон.
Стилизация и использование классов 1:27:02 Обсуждаются стилизация заголовка, изображения и списка ингредиентов. Задаются различные стили для элементов, такие как фон, шрифт и курсивность.
Завершение разбора задания 1:31:48 Обсуждаются оставшиеся пункты задания и стилизация финального сообщения. Задается вопрос о продолжении изучения аштимель или возвращении к штимель.