
В этом уроке мы рассмотрим:
HTML, версии HTML
Из чего состоит HTML страница
Одинарные / Парные теги
Вложенность тегов
Семантика
Атрибуты
В этом уроке мы рассмотрим:
Что такое CSS, версии CSS
Синтаксис
Как подключить к HTML странице
Стили браузера, их сбрасывание
В этом уроке мы рассмотрим:
Базовые селекторы
Селекторы атрибутов
Комбинирование
В этом уроке мы рассмотрим:
Операторы в селекторах атрибутов
Иерархические селекторы
В этом уроке мы рассмотрим:
Псевдоклассы
Псевдоэлементы
В этом уроке мы рассмотрим:
Размеры - width, height
Поля - padding
Отступы - margin
Рамки - border
Скругленные углы - border-radius
Outline и box-shadow
В этом уроке мы рассмотрим:
Позиционирование элементов
Плавающие (float) элементы
Порядок отображения по оси Z
В этом уроке мы рассмотрим:
Какие проблемы решает flexbox?
Гибкий контейнер и гибкие элементы
Центрировние
В этом уроке мы рассмотрим:
Display, Visibility
Cursor - Виды курсоров
Overflow - переполнение блока
В этом уроке мы рассмотрим:
Форматирование текста
Font, подключение шрифтов
Списки
Выравнивание текста + отступы
В этом уроке мы рассмотрим:
Цвет и как с ним работать
Устанавливаем цвет фона
Устанавливаем картинку на фон
Gradient
Sprites
В этом уроке мы рассмотрим:
Наследование
Специфичность
!important
Каскады стилей
В этом уроке мы рассмотрим:
<img>, <figure>
<video>
<iframe>
В этом уроке мы рассмотрим:
Элементы форм
Типы инпутов
Атрибуты инпутов
Стилизация форм
В этом уроке мы рассмотрим:
Структура таблицы
Стилизация таблиц
В этом уроке мы рассмотрим:
SVG. Для чего используются
Сравним SVG с изображением
Font Awesome
В этом уроке мы рассмотрим:
Transition - плавное изменение CSS свойств
Animation - более продвинутые анимации
В этом уроке мы рассмотрим:
2D трансформации
3D трансформации
В этом уроке мы рассмотрим:
Viewport
Резиновые блоки
Относительные величины для работы со шрифтами
В этом уроке мы рассмотрим:
Responsive and adaptive
Медиа запросы
Mobile first
<picture>, <video>
В этом уроке мы рассмотрим:
Преимущества
Как установить и настроить
Основные возможности
Отличие SASS, LESS, Stylus
Обновление (Октябрь 2021)
В "Ресурсах" к уроку "Знакомство с CSS" прикреплен архив со кодом для всех уроков курса, удобно разложенный по папкам.
В этом курсе вы изучите современный HTML и CSS - то, с чего начинает каждый Веб-разработчик.
Если вы ранее не написали ни единой строчки кода - этот курс для Вас. Если ранее пытались изучать, но по каким-то причинам отвлеклись от обучения или даже работали раньше с HTML / CSS, но многое подзабылось - этот курс так же для Вас!
Языки программирования постоянно развиваются. Что-то устаревает, что-то появляется новенькое. Начинающему разработчику часто сложно сориентироваться в потоке информации на самом старте. Этот курс подробно и постепенно проведет Вас по главным составляющим языка разметки HTML, а так же мы научимся задавать стили странице современными инструментами, актуальными в 2020 году.
Важным преимуществом преимуществом является то, что всю рассмотренную теорию Вы закрепите на практике. В каждом уроке решаются практические задачи. А для закрепления материала вы получите после каждой лекции домашние задания. Задания нужно сделать самому, а в качестве проверки будет предоставлен рабочий код, с которым можно сравнить свое решение. Так вы научитесь работать самостоятельно и увидите много кода, написанного опытным разработчиком.
Что Вы изучите в этом курсе?
Как настроить рабочие инструменты Веб-разработчика
Основы и строительные блоки HTML и CSS
СSS селекторы
Взаиморасположение элементов на странице (inline / block, position, видимость элементов)
Flexbox как основной инструмент для стилизации сайта
Cтилизация текста
Работа с медиа файлами и графикой (картинки, видео, SVG)
Работа с формами
Работа с таблицами
Анимации и трансформации
Создание отзывчивых и адаптивных сайтов - тех, которые одинаково хорошо работают как на маленьком телефоне, так и на большом экране компьютера
Использование методологии БЕМ
Использование препроцессоров для оптимизации написания стилей
Буду рад помочь освоить непростую, но интересную и прибыльную профессию Веб-разработчика. Увидимся!