Основы HTML и CSS онлайн

Изучение основ верстки сайтов.

Площадка:GeekBrains
Продолжительность:8 видеоуроков
Дата:после регистрации
Стоимость:бесплатно

Оставить заявку

О курсе

Изучив html, вы сможете создать адаптивную веб-страницу или веб-сайт. Изучив css — сможете оформить свёрстанный сайт.

На курсе вы изучите:

основы верстки адаптивных сайтов;
кроссбраузерность;
основы flexbox-верстки;
основы работы с дизайн-макетом Figma;
оформление веб-страниц стилями CSS.

Мы изучаем:

html
css

Кому подойдет курс

Курс подойдет школьникам 13-17 лет

Необходимые навыки

Специальных навыков не требуется

Эксперты

Эксперты - специалисты GeekBrains

Эксперты Geek Brains
Опытные преподаватели-практики

Карьера

Занимаясь на курсе, обучающиеся изучают современные инструменты и приобретают навыки работы, которые помогут им эффективно продолжать обучение в сфере IT и строить карьеру в будущем.

Программа курса

1 / Основные понятия в веб-разработке

Знакомство, вводная информация настройка visual studio code,горячие клавиши, установка расширений. Создание html документа Структура html документа. Виды и атрибуты тегов Отладчик браузера

2 / Основы языка разметки документов HTML

Списки в html Спецсимволы и комментарии Гиперссылки (локальные, абсолютные, якоря) Типы изображений для web; Формы и их элементы. Просмотр, редактирование, поиск ошибок через отладчик браузера

3 / Основы языка оформления стилей документа CSS

Введение в стили Способы подключения стилей Селекторы Базовые свойства стилей (px, %, background, color, border) часть 1 Базовые свойства стилей (width, height, font, list-style, текст) Вложенность наследование и группирование свойств

4 / Основные тэги для вёрстки, Псевдоклассы и псевдоэлементы

Основные теги div, span, создание блочной структуры Отступы у элементов Обтекаемые элементы Псевдоклассы Псевдоэлементы Таблицы

5 / Основы позиционирования, работа с Flexbox

Свойство display Что такое flexbox (горизонтальное и вертикальное расположение) Порядок отображения, многострочность, смещение отдельного блока Задание гибких размеров для блоков Position: relative и absolute

6 / Работа с макетом дизайна в формате Figma

Что такое макет и какие виды макетов бывают Знакомство с программой Figma, нарезка макета Определение размеров блоков, создание блочной структуры Добавление стилей из макета Создание сайта по макету. Часть 1 Создание сайта по макету. Часть 2

7 / Основы создания адаптивного сайта

Гибкие размеры блоков, адаптивного сайта Эмуляция мобильных устройств Медиа-запросы Прижатие подвала к нижней части экрана Практика создания адаптивного сайта Практика создания адаптивного сайта часть 2

8 / Стандарты web и вспомогательные инструменты

Инструменты разработчика. Часть 1 Загрузка проектов на сервер Кроссбраузерность Знакомство с Boostrap Знакомство с препроцессором Sass Практическое использование препроцессора Sass

Записаться на курс

Площадка проведения: GeekBrains

Для уточнения места проведения свяжитесь с организатором

Оставить заявку