Курс HTML/CSS Advanced

С помощью этого курса HTML и CSS вы узнаете основы верстки веб-сайтов и создадите учебный сайт KinoMonster.

5 / 551
Начать обучение Регистрация

  • 162 заданий
  • 17 часов видео
  • Сертификат об окончании

О курсе

Курс HTML/CSS Advanced поможет вам изучить современную верстку веб-сайтов.

В уроках HTML и CSS вы узнаете:

  • Как верстать блоки на сайте с помощью Grid
  • Что такое Flexbox и как Flexbox упрощает позиционирование блоков на сайте
  • Как создавать адаптивную верстку
  • Научитесь использовать псевдоэлементы ::after и ::before
  • Как подключать внешние CSS-стили к сайту, а также Javascript скрипты и библиотеки
  • Научитесь пользоваться популярным редактором кода Visual Studio Code
  • Изучите Grid System
  • Научитесь встраивать видео на ваш сайт
  • Познакомитесь с CSS-анимацией

Изучив современную верстку веб-сайтов, вы сможете создавать верстку веб-сайтов любой сложности. Макет сайта KinoMonster будет доступен в популярной программе для дизайна и прототипирования Figma.

Начать обучение

План курса

Программа обучения состоит из видео уроков по HTML и CSS, а также включает интерактивные тесты и интерактивные тренажеры, позволяющие закрепить полученные вами знания на практике.


1
О курсе HTML/CSS Advanced

3
Базовый HTML

5
Базовый CSS

8
Позиционирование CSS Grid

12
Практическая часть: Знакомство с Figma

13
Практическая часть: Создаем Header (верхняя часть сайта)

14
Практическая часть: Создаем Footer (нижняя часть сайта)

19
Практическая часть: Страница Login и Register



Отзывы(78)

Отзывы о курсе верстки HTML и CSS.

14.04.2022
Талантбек Жумаев

Очень хороший курс.

12.04.2022
Костя

Некоторые моменты опускались автором. В целом не плохо если закрыть глаза на множество недочетов.

12.04.2022
Максим Маслов

Познавательно, спасибо

11.04.2022
oleg

Очень хороший курс. Особенно для новичков. Хорошее изложение материала + практические примеры. Буду продолжать изучать следующие курсы. Большое спасибо за Ваши курсы они очень полезны для новичков. Если я в свои 60 лет начинаю что то понимать пройдя только курс HTML/CSS Advanced, что говорить о молодежи. Всем советую!!

09.04.2022
Viacheslav Kulyk

Отличный курс, виден на лицо прогресс в плане подачи и структуризации материала относительно Basic HTML/CSS. Продолжайте в том же духе, всё очень нравится!

05.04.2022
Anatoliy Kornilenko

Очень крутой курс. В целом курс очень интересен. Но его я посоветую тем кто уже немного понимает, что такое программирование + маловато заданий как для курса - сделайте больше заданий. Рекомендую

29.03.2022
Vitaly Illinskiy

Замечательные курсы! Во-первых - доступность. Я, пенсионер, могу себе позволить учиться, вторых таких курсов не знаю. Во-вторых изложение материала. Сергей, Вы педагог от Бога. Многие лета Вам и всяческих успехов в таком нужном деле! Виталий.

29.03.2022
Никита Ковалевский

Отличный курс! Спасибо!

28.03.2022
Alexander Valentey

Отличный курс, его будет вполне достаточно для верстки, я думаю, большинства сайтов. Есть практика в виде интерактивных заданий, но задания слишком простые и хотелось бы чего-нибудь более требовательного. Но комплексно курс очень хороший и качественный. Спасибо.

25.03.2022
Тимофей Морозов

Просто бомба

25.03.2022
Юрий Сулыгин

Курс отличный! После прохождения почувствовал у себя наличие неплохой базы для выполнения пусть небольших, но уже самостоятельных проектов. Однозначно 5 баллов!

21.03.2022
Nikita Hurski

Супер курс

19.03.2022
Александр Казаков

Отличный курс! Грамотная подача материала, местами было сложно и непонятно, но очень интересно! Я бы внес некоторые изменения на сайте - FructCode, чтобы можно было просматривать видеоуроки, как вместе с интерактивными заданиями, так и отдельно от них.

02.03.2022
Алексей Владимирович...

Отличный курс!!! Всё объясняется понятно и доступно.

14.02.2022
Роман Дідич

Курс мне очень понравился.

13.02.2022
student_VPUq_wh0

Понравился курс! Киномонстер получился намного интереснее, чем в прошлом курсе, но и сложнее. Теории по html и css тоже достаточно.

12.02.2022
Vladyslav Kardash

Интересный курс. Под конец было сложно соглашаться с некоторыми решениями, показанными в уроках. Не совсем понятны длинные обращения к элементам.

06.02.2022
Иван Ермашов

Отличный курс. Все супер!!!

05.02.2022
Роман Незнаєнко

Курс очень полезный, интересный, соответствует теме и доступно выкладывается материал, всем советую.

28.01.2022
Anna Vasileva

Полезный курс. Доступно и интересно всё объясняет

28.01.2022
Евгений

Спасибо огромное, мне очень помог в обучении этот курс!!

27.01.2022
student_5X1YqLbg

Супер курс! Узнал много о верстке сайтов и понял как верстать с помощью css grid и flexbox.

27.01.2022
student_L8efDYX_

Много узнал деталей, которые облегчают написание кода (emmet, многострочный ввод). Но остались вопросы, можно ли, например, на практике использовать сетку для всего сайта? На практике она использовалась только для футера. Что делать с блоком hero если он отображается по разному при разном разрешении браузера? И так далее... нехватает подводных камней, как обстоят дела в реальных полевых условиях(работе). Но за свои деньги курс однозначно стоит.

20.01.2022
student_Jw6CEVsI

Отличный курс! Очень много информации, которую объяснили доступным языком. Проект понравился!

18.01.2022
Амангельды Кемалов

Все понятно, даже для новичка

17.01.2022
student_aPnalwdy

Курс очень подробный, по сравнению с прошлым курсом HTML/CSS. Все понятно объясняется. Очень понравился учебный проект KinoMonster.

15.01.2022
Ирина Ильина

Спасибо за курс! Много информации и практики.

Начать обучение

Часто задаваемые вопросы

Почему такая низкая цена?

Одна из миссий проекта FructCode сделать дорогое ИТ-образование доступным для всех!

Когда начнется обучение? Нужно ли ждать когда наберется группа?

Сразу после оплаты, вы получите полный доступ к данному курсу без ожиданий.

Получу ли я после прохождения курса сертификат?

Да! За успешное прохождение каждого курса, вы получите сертификат на нескольких языках: Русский, Английский, Немецкий, Французский, Итальянский. Все сертификаты, полученные за курсы, вы можете найти в вашем профиле

Как проходит обучение?

Обучение разделено на видео лекции, интерактивные задания и тесты. В видео лекциях вы получаете теоретический материал и с помощью интерактивных заданий закрепляете теорию на практике. Вы пишите код прямо в браузере и мгновенно получаете результат проверки вашего кода - верно или нет. Практически в каждом уроке есть ссылки на дополнительные материалы и исходный код.

Актуальны ли курсы?

Да! Курсы на платформе FructCode достаточно часто обновляются, в том числе исходные коды.

Какое оборудование нужно для прохождения курса?

Курсы FructCode вы можете проходить в любой операционной системе - Windows, Mac OS или Linux, а также в мобильных устройствах. Тем не менее, для комфортного прохождения курсов FructCode, мы рекомендуем иметь монитор с разрешением экрана 1920x1080.

При прохождении курса я не знаю как выполнить задание, что делать?

Если в процессе прохождения курса у вас возникла проблема с выполнением задания и вопрос по пройденной теме курса, вы можете задать его в комьюнити FructCode - https://fructcode.com/ru/qa/, где другие студенты, которые успешно решили задание, вам обязательно помогут.

Что такое XP? Что оно дает?

XP - это сокращение от английского слова experience и переводится как опыт. За успешное прохождение задания вы получаете определенное количество XP. Чем больше XP вы накапливаете, тем больше опыта в программировании у вас становится.

Как участвовать в рейтинге? Я набрал достаточно XP, но не показываюсь в рейтингах курса, почему?

В общем рейтинге участвуют пользователи, которые установили аватар в настройках профиля

Что если мне не подойдет или не понравится курс?

Если в процессе прохождения курса вы поймете, что вам не подходит данный курс - в течении 30 дней с даты покупки, вы можете вернуть деньги в полном объеме. Для возврата средств напишите в службу поддержки на почту [email protected]

У меня не работает видео лекция или не открывается задание, что делать?

Наиболее частая причина, если что-то не работает - это установленные некоторые расширения для браузера, например Adblock. Если у вас возникает техническая проблема, напишите пожалуйста в нашу службу поддержки на почту [email protected] и мы в кратчайшее время постараемся помочь

У меня остались вопросы о курсе, кому я могу их задать?

Если у вас остались дополнительные вопросы о курсах FructCode, пожалуйста напишите в нашу службу поддержки на почту [email protected] и мы постараемся ответить в ближайшее время.

Я находил ваши курсы на других сайтах. Есть ли разница где учиться?

Да! Только на сайте FructCode.com вы можете найти актуальные версии моих курсов. На других сайтах вы можете найти пиратские старые версии моих курсов или неактуальные версии моих курсов, в процессе прохождения которых, вы столкнетесь с ошибками, так как программы уже давно изменились. Покупая мои курсы на сайте FructCode.com вы инвестируете не только в свои знания, но и инвестируете в создание новых курсов.

Преподаватель

Sergei Nikonov. Автор курса программирования HTML/CSS Advanced | FructCode
Sergei Nikonov
  • Основатель проекта FructCode
  • Опыт в веб-разработке более 10 лет
  • Работал над высоконагруженными веб-проектами в крупных компаниях США и ЕВРОПЫ
  • Провел несколько десятков оффлайн и онлайн семинаров на тему веб-разработки
  • student_GFqz-sk7
    30027 xp
    1
  • student_mT3o6Vf0
    15762 xp
    2
  • student_3l2ol8y4
    12987 xp
    3
  • Volodia Dolynka
    12370 xp
    4
  • Chris Hlooflish
    12370 xp
    5
  • У вас 0 XP за курс HTML/CSS Advanced

    Бросить вызов?