Курс 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.

26.11.2022
Андрій Шундик

Прекрасний курс, все зрозуміло та доступно викладають матеріал, дякую, рекомендую!)

24.11.2022
student_mxm02b61

Очень классный курс, все четко объясняете, но хотелось бы больше практических занятий

22.11.2022
Bahrom Kurbanov

Respect. All great

21.11.2022
Марк Кодидло

Дуже класний курс всім раджу, якщоб не він би не вмів робити сайти

21.11.2022
Богдан Зіньківський

Отличный курс)

20.11.2022
Kozachenko Denis

Подано качественно по полочкам. Делать и изучать было приятно, никак не выгорал после ошибок, а ещё больше интересовался как оно устроено. Советую для тех кто начинает этот курс.

19.11.2022
Yuriy Zadorozhnyi

Дякую, дійсно достойний курс, я задоволений.

18.11.2022
golgo13

Классное обучение 5 из 5 однозначно

15.11.2022
Юлия Веселова

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

27.10.2022
Юрий Степанчук

Курс дуже цікавий та інформативний! Багото чого дізнався нового та зверстав по прикладу сучасний сайт про Кіно!

22.10.2022
Narek Aramyan

Если ты думаешь, что ты знаешь HTML/CSS, без прохождения этого курса... то ты ошибаешься!)

02.10.2022
Айтуар Жангазин

Очень полезный курс!

27.09.2022
Daniils Lusnickis

Топ за свои деньги

24.09.2022
Виталий Синявский

Отличный курс. Спасибо Вам, Сергей!

13.09.2022
student_DyS7orcM

Достаточно интерактивный.

08.09.2022
Денис Гиренко

Я значительно повысил свой уровень html/css, спасибо за новые знания!!! ;)

08.09.2022
Сергей Касьянюк

Отличный курс для начинающих. Сергею благодарность за понятное объяснение материала. Класс!

31.08.2022
Михайло Кащавцев

Спасибо большое за курс очень информативный и подробный, максимально понятный

17.08.2022
Христо Горелков

Благодаря Сергею за усилия и опыт, которым он поделился с нами. Курс великолепен, я узнал много новых полезных вещей

14.08.2022
Roma Lypko

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

07.08.2022
Denys Merenkov

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

06.08.2022
Lolita Shamonova

Курс понравился, поняла, в каких темах не хватает знаний, хотелось бы больше практики.

02.08.2022
Тимур Сотников

Базовано 10/10

23.07.2022
Александр Семичев

Доступно и интересно, хотелось бы больше заданий.

20.07.2022
Pavlo Oslam

Отличный курс, удобный и понятный

19.07.2022
Евгений Макидон

Курс очень крутой. Много информации, которую тебе подают, а ты бери и просто запоминай и не ленись)))

15.07.2022
Nataliia Veselova

Спасибо большое за курс! Получила много полезной информации. Разобралась во многих вещах, которые до этого были непонятными. Практическая часть c версткой сайта и написанием java script-кода для меня была сложнее, чем предыдущие уроки курса. Хотелось бы, чтобы задания для закрепления материала были сложнее. В целом курс очень информативный и стоит того, чтобы его прошел каждый, кто начинает изучать веб-разработку.

13.07.2022
Назар Шашков

Thanks!

13.07.2022
Alexey Sereda

Отличный курс, мне понравился, всё доступно и понятно. Особенно приятно было когда были допущены ошибки, поскольку новичкам будет полезно учиться решать подобные проблемы, а вы наглядным примером показали как это делать.

11.07.2022
Yurii Monashnenko

Початковий курс HTML/CSS Advanced подається зрозуміло і засвоюється достатньо легко!

05.07.2022
Andrii Herasymchuk

Чудовий курс для навчання!

05.07.2022
Pavel Didenko

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

28.06.2022
Богдан Плотников

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

19.06.2022
Юра Старченко

Ну такой не плохой курс за эти деньги

19.06.2022
Svitlana Moroz

Отличный курс, последние уроки сложноваты для восприятия. Но в целом отлично! Доступно и удобно.

14.06.2022
Aleksandr Samoilenko

Курс отличный, я раньше проходил просто курс HTML/CSS и для меня он был супер, но Advanced - еще более информативный с большим количеством полезных фишек, которые помогают создать современный сайт. Я в восторге от прохождения данного курса. Спасибо большое FructCode.

13.06.2022
Сергей Жданович

Курс интересно сделан, иногда действия выполняются слишком быстро и не успеваешь понять что к чему, ДЗ на более поздних этапах могли бы быть сложнее. Радует, что Сергей выполняет не идеально, т.к. становится более понятно, почему что-то не работает. Ошибки вносят больше ясности в происходящее.

09.06.2022
Vladyslav Merezhko

Курс сподобався дізнався багатонового та систематизував наявні та набуті знання. Дужк чекаю на доповнення курсі у розробці

05.06.2022
stepan gudzovatiy

Cool

04.06.2022
student_yk6N8IiL

Хороший курс, достаточно полный в сравнение с остальными в интернете. Сергей, просьба которая поможет улучшить курс. Как известно все знания и навыки без использования со временем забываются без практики, во время уроков вы очень часто напоминаете о том, что рассказывали ранее в своих уроках о том или ином тэге или свойстве используемом при верстке. Иногда поиск урока затягивается. Возможно только у меня возникли такие затруднения, но думаю это сделало бы курс более юзабельным и удобным.

03.06.2022
Андрій Слободян

Цікавий курс, по можливості хотів би, щоб з часом добавився курс по методології написання коду, а саме найменування класів тощо. Дякую за курс!

01.06.2022
Vlad Sivenkov

Cool

26.05.2022
Volodymyr Kovalenko

Отличный курс, единственное, что смутило - слишком элементарные интерактивные задания особенно ближе к завершению курса. А так понравилось, планирую продолжить обучения далее. Буду советовать

20.05.2022
Шахрiяр Юсупов

Отличный курс!

11.05.2022
Андрей Веленский

Намного правильней построен процесс обучения, чем в HTML/CSS. А так же более актуальная информация.

24.04.2022
Валера Кузнецов

Сначала думал что курс не особо будет хороший, но пару уроков в бесплатной версии курса показали что я ошибаюсь.Зарегистрировался на платную версию, и начал изучать все с первого урока. Каждый урок объясняется доходчиво, проговаривается каждый шаг в процессе обучения, без заумных слов или еще чего то, что начинающий может не понять. Курс просто шикарен, спасибо большое Сергей Никонов что создали его.

20.04.2022
Yerbol Saranzhipov

Спасибо за курс, теперь нужна практика и Javascript

19.04.2022
Anisia Gutu

Самый лучший курс, спасибо вам!!!!

17.04.2022
Евгений Пархоменко

Апладирую ВАМ стоя!!!!!!!!!!!!!!!!!!!!!!!

16.04.2022
Артур Бобров

Отличный курс чтобы понять основы, благодарю за курс )))

15.04.2022
student_hZLN25nE

Интересно, надо быть очень внимательным здесь нет мелочей.

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

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

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

Одна из миссий проекта 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
    17367 xp
    2
  • student_3l2ol8y4
    12987 xp
    3
  • Volodia Dolynka
    12370 xp
    4
  • Chris Hlooflish
    12370 xp
    5
  • У вас 0 XP за курс HTML/CSS Advanced

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