Содержание курса
1. Введение в HTML
  • Учебник по Html/Css-верстке
  • Урок 1. Основные понятия HTML
  • Урок 2. Структура HTML-документа
  • Урок 3. Теги HTML и атрибуты
  • Задача 1. Добро пожаловать в мир HTML!
  • Задача 2. Список любимых фильмов
  • Задача 3. Выделяем слова
  • Задача 4. Добавляем ссылку на любимый сайт
  • Задача 5. Вставляем изображение
2. Разметка контента
  • Урок 1. Текстовые теги HTML
  • Урок 2. Теги для изображений и мультимедиа
  • Урок 3. Теги для таблиц и списков
  • Урок 4. Формы и элементы управления формами
  • Урок 5. Атрибуты тегов, связанные с доступностью и SEO
  • Задача 1. Создаём HTML-страницу
  • Задача 2. Создание параграфа
  • Задача 3. Добавляем таблицы
  • Задача 4. Создаём форму отправки
  • Задача 5. Описываем изображение
  • Задача 6. Создание списка
  • Задача 7. Создание столбцов
  • Задача 8. Итоговая страница
3. Введение в CSS
  • Урок 1. Что такое CSS и как его подключить?
  • Урок 2. Синтаксис CSS
  • Урок 3. Селекторы CSS
  • Урок 4. Свойства CSS
  • Урок 5. Понимание CSS Box Model и тег DIV
  • Задача 1. Стилизация текста
  • Задача 2. Две кнопки
  • Задача 3. Стилизация блоков
  • Задача 4. Стилизация параграфов
  • Задача 5. Используем селекторы по атрибуту
  • Задача 6. Стилизация через псевдоклассы
  • Задача 7. Стилизация таблиц
4. Оформление контента
  • Урок 1. Web-шрифты
  • Урок 2. Цвета и фоны
  • Урок 3. Размеры и отступы
  • Урок 4. Типографика
  • Урок 5. Позиционирование и блочная модель
  • Урок 6. Трансформации и анимации
  • Урок 7. Семантические теги HTML
  • Задача 1. Два текстовых блока
  • Задача 2. Моя любимая музыка
  • Задача 3. Раскраска элементов
  • Задача 4. Текст в рамке
  • Задача 5. Две колонки текста
  • Задача 6. Увеличение блока
  • Задача 7. Анимированный блок
  • Задача 8. Объединяем всё
5. Адаптивный дизайн
  • Урок 1. Тег Meta и его атрибуты по типу viewport
  • Урок 2. Медиа-запросы
  • Урок 3. Гибкие и жесткие единицы измерения
  • Урок 4. Flexbox
  • Урок 5. Grid Layout
  • Урок 6. Адаптивные изображения и SVG
  • Урок 7. CSS-фреймворки и библиотеки
  • Задача 1. Масштабирование страницы
  • Задача 2. Изменение ширины экрана
  • Задача 3. Задаём гибкие и жесткие единицы измерения
  • Задача 4. Используем grid
  • Задача 5. Адаптивное изображение
  • Задача 6. Объединяем всё
  • Задача 7. Объединяем всё и больше
6. Дополнительные возможности
  • Урок 1. Рекомендации W3C
  • Урок 2. Нестандартные возможности CSS: фильтры
  • Урок 3. Переменные CSS
  • Урок 4. Дизайн стилей с учетом возможностей браузеров
  • Урок 5. Другие возможности CSS
  • Задача 1. Изменяем внешний вида изображения
  • Задача 2. Определение основных цветов и шрифтов
  • Задача 3. Семантический код

Учебник по Html/Css-верстке

Курс обновлен в марте 2024 года.

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

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

Пройдя данный самоучитель, вы освоите актуальные основы верстки с использованием HTML и CSS.
Курс поделен на разделы. Внутри каждого раздела сначала идут теоретические уроки, а потом практические задания с решениями. Проходите уроки и задания по очереди, ничего не пропуская.

Курс разделен на следующие темы:
1. Введение в HTML: история, применение и особенности языка. Основы создания структуры веб-страниц.
2. Разметка контента: текстовые элементы, списки, ссылки, изображения и мультимедиа. Создание и структура таблиц и форм.
3. Введение в CSS: история, применение и особенности языка. Селекторы, правила и подключение стилей к HTML-документам.
4. Оформление контента: стилизация текста, шрифтов, цвета и фона. Работа с блочной моделью, позиционированием и гибкой версткой.
5. Адаптивный дизайн: применение медиазапросов, отзывчивые изображения и создание мобильной верстки.
6. Дополнительные возможности: продвинутые техники работы с CSS, анимации, преобразования и переходы.

Предыдущий
Следующий
Комментарии:
Александр Морозов
19 марта 2023

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

Зайцева Ксения
4 апреля 2023

Благодарю за курс! HTML стал гораздо понятнее

Артем Романов
15 апреля 2023

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

Татьяна Петухова
21 апреля 2023

Вот и еще один курс по верстке... Ну ладно, все равно удачи новичкам, может, кому-то действительно поможет в дальнейшей карьере.

Cox_SPb
24 июля 2024

Какая вы умная!
Может посоветуете один, но идеальный, который может заменить все остальные учебные материалы по вёрстке? Бесплатный при этом.

Svetlana36
17 мая 2023

Удачи всем!!!

yandex_user
1 июня 2023

Пробежалась по курсу. Отличная структура и разъяснение. Все понятно и применимо на практике тут же.

admin
15 февраля 2024

Уважаемые пользователи! К сожалению, сейчас сертификат не выдается автоматически, после завершения курса пришлите ваше ФИО с указанием пройденного курса на почту admin@katalog-kursov.ru - мы проверим прохождение курса и пришлем сертификат :)

Добавить комментарий
Категории курсов