Семестр 1. Азы HTML и CSS

Вступительное тестирование

Тест № ВКТ-510 Основы компьютерной грамотности (для АИШ)

Необходимы знания и навыки для успешного прохождения тестирования:

• Понятия файла
• Понятие папки
• Расширение файлов
• Работа с файловой системой: копирование, удаление, перемещение, поиск, создание файлов и папок
• Горячие клавиши
• Работа с оконными приложениями
• Работа с мышкой
• Устройство и принцип работы компьютера
• Операционная система: что это такое, цели и задачи

Занятие 1

Основы HTML

• Понятие тега и атрибута
• Структура кода страницы

Разметка текста

• Заголовки
• Параграфы
• Выделение текста
• Цитаты и источники

Занятие 2

Адресация

• Понятие URL
• Абсолютная адресация
• Относительная адресация

Списки

• Маркированный
• Нумерованный
• Многоуровневый
• Определений

Занятие 3

Изображения

• Графические форматы
• Тег Img и его атрибуты
• Группировка изображений и подписей к ним
• Тег Picture

Ссылки

• Тег a и его атрибуты
• Абсолютная ссылка
• Относительная ссылка
• Местная (локальная) ссылка

Занятие 4

Основы CSS

• Подключение CSS
• Понятие селектора
• Селекторы тега и класса

Форматирование текста

• Шрифт и размер
• Цвет и тень
• Высота строки и выравнивание
• Начертание и насыщенность
• Интервал между символами и отступ первой строки

Занятие 5

Селекторы

• Дочерний
• Контекстный
• Соседний
• Родственный

Стили для списков

• Стиль маркера и номера
• Изображение вместо маркера
• Псевдоэлемент ::before

Стили для ссылок

• Псевдоклассы :hover и visited
• Декоративные эффекты для текста
• Псевдокласс :target

Занятие 6

Таблицы в HTML

• Основные теги таблицы
• Разделы таблицы

Стилевые свойства таблиц

• Схлопывание границ таблицы
• Псевдокласс :nth-child()

Занятие 7

Формы в HTML

• Тег Form и его атрибуты
• Тег Input и его атрибуты
• Кнопка Button
• Список выбора
• Многострочное текстовое поле
• Группировка элементов формы

Особенности стилей

• Псевдоклассы :checked, :focus, :required
• Псевдоэлемент ::placeholder

Занятие 8

Блочная модель

• Блочный и строчный (встроенный) элементы
• Ширина блока, поля, границы и отступы
• Схлопывание отступов
• Фон

Занятие 9

Блочная верстка

• Свойство Display
• Свойство Float

Занятие 10

Структурные элементы страницы

• Header
• Nav
• Main
• Aside
• Footer

Верстка страницы сайта в две колонки

Занятие 11-12

Итоговая работа