HTML (HyperText Markup Language, язык разметки гипертекста) — это прежде всего система вёрстки, которая определяет, как и какие элементы должны располагаться на веб-странице. Информация на сайте, способ её представления и оформления зависят исключительно от разработчика и тех целей, которые он перед собой ставит.
CSS (Cascading Style Sheets, каскадные таблицы стилей)? Стилем называется набор параметров форматирования, который применяется к элементам документа, чтобы изменить их внешний вид. Возможность работы со стилями издавна включают в развитые издательские системы и текстовые редакторы, тем самым позволяя одним нажатием кнопки придать тексту заданный, заранее установленный вид. Теперь это доступно и создателям сайта, когда цвет, размеры текста и другие параметры хранятся в определённом месте и легко «прикручиваются» к любому элементу.
Ещё одним преимуществом стилей является то, что они предлагают намного больше возможностей для форматирования, чем обычный HTML. CSS представляет собой мощную систему, расширяющую возможности дизайна и вёрстки веб-страниц.
Цель
Научиться создавать HTML страницы, верстать и анимировать элементы на странице. Предварительная подготовка: опытный пользователь ПК, особая подготовка не требуется.
Программа
1. Текст - Шрифты
- Установка шрифта
- Загрузка своего шрифта
- Размер текста
- Начертание- Размер текста
- Наклон текста
- Насыщенность
- Верхний и нижний индекс
- Буквица
2. Фон
- Цвет фона
- Фоновая картинка
- Масштабирование фона
- Спрайты
- Несколько фоновых картинок
- Линейный градиент
- Радиальный градиент
3. Ссылки
- Виды ссылок
- Оформление ссылок
- Ссылки внутри страницы
4. Списки
- Маркированные списки
- Нумерованные списки
- Вложенные списки
- Список описаний
- Использование списков
5. Изображения
- Форматы графических файлов- Масштабирование картинок
- Элемент figure
- Подрисуночная подпись
- Выравнивание картинок
- Рамка вокруг изображений
- Круглые изображения
- Карты-изображения
6. Таблицы
- Структура таблицы
- Заголовок таблицы
- Объединение ячеек
- Оформление таблиц
7. Формы
- Отправка данных формы
- Текстовое поле
- Поле для ввода пароля
- Многострочное текстовое поле
- Кнопки
- Элемент label
- Переключатели
- Флажки
- Поле со списком
- Скрытое поле
- Поле с изображением
- Загрузка файлов
- Адрес электронной почты
- Веб-адрес
- Выбор цвета
- Ввод чисел
- Ползунок
- Календарь
- Поле для поиска
- Номер телефона
- Группирование элементов форм
- Блокирование элементов форм
- Автофокус
- Подсказывающий текст
- Защита от дурака
8. Трансформация
- Функции трансформации
- Матрица преобразований
- Точка трансформации
9. Переходы
10. Анимация