Основы технологии верстки на HTML5 и CSS3 — SynergyCom

Основы технологии верстки на HTML5 и CSS3

Код курса: WEB-001 Продолжительность: 3 дня (24 часа)

Аннотация

HTML (HyperText Markup Language, язык разметки гипертекста) —  это прежде всего система вёрстки, которая определяет, как и какие элементы должны располагаться на веб-странице. Информация на сайте, способ её представления и оформления зависят исключительно от разработчика и тех целей, которые он перед собой ставит.

CSS (Cascading Style Sheets, каскадные таблицы стилей) — стилем называется набор параметров форматирования, который применяется к элементам документа, чтобы изменить их внешний вид. Возможность работы со стилями издавна включают в развитые издательские системы и текстовые редакторы, тем самым позволяя одним нажатием кнопки придать тексту заданный, заранее установленный вид. Теперь это доступно и создателям сайта, когда цвет, размеры текста и другие параметры хранятся в определённом месте и легко «прикручиваются» к любому элементу.

Ещё одним преимуществом стилей является то, что они предлагают намного больше возможностей для форматирования, чем обычный HTML. CSS представляет собой мощную систему, расширяющую возможности дизайна и вёрстки веб-страниц.

Цель

Научиться создавать HTML страницы, верстать и анимировать элементы на странице.

Предварительная подготовка

  • Опытный пользователь ПК (особая подготовка не требуется).

 

 

  1. Текст
  • Шрифты
  • Установка шрифта
  • Загрузка своего шрифта
  • Размер текста
  • Начертание
  • Наклон текста
  • Насыщенность
  • Верхний и нижний индекс
  • Буквица
  1. Фон
  • Цвет фона
  • Фоновая картинка
  • Масштабирование фона
  • Спрайты
  • Несколько фоновых картинок
  • Линейный градиент
  • Радиальный градиент
  1. Ссылки
  • Виды ссылок
  • Оформление ссылок
  • Ссылки внутри страницы
  1. Списки
  • Маркированные списки
  • Нумерованные списки
  • Вложенные списки
  • Список описаний
  • Использование списков
  1. Изображения
  • Форматы графических файлов
  • Масштабирование картинок
  • Элемент figure
  • Подрисуночная подпись
  • Выравнивание картинок
  • Рамка вокруг изображений
  • Круглые изображения
  • Карты-изображения
  1. Таблицы
  • Структура таблицы
  • Заголовок таблицы
  • Объединение ячеек
  • Оформление таблиц
  1. Формы
  • Отправка данных формы
  • Текстовое поле
  • Поле для ввода пароля
  • Многострочное текстовое поле
  • Кнопки
  • Элемент label
  • Переключатели
  • Флажки
  • Поле со списком
  • Скрытое поле
  • Поле с изображением
  • Загрузка файлов
  • Адрес электронной почты
  • Веб-адрес
  • Выбор цвета
  • Ввод чисел
  • Ползунок
  • Календарь
  • Поле для поиска
  • Номер телефона
  • Группирование элементов форм
  • Блокирование элементов форм
  • Автофокус
  • Подсказывающий текст
  • Защита от дурака
  1. Трансформация
  • Функции трансформации
  • Матрица преобразований
  • Точка трансформации
  1. Переходы
  2. Анимация

Курс не запланирован.

Вы можете подать заявку на открытие курса:

Каталог услуг

Поиск по сайту