Рубрика «Веб-дизайн»

HTML5 Новые элементы

                               HTML5 Новые элементы Новые элементы в HTML5 Ниже приведен список новых элементов HTML5 и описание того, для чего они используются. Новые семантические / структурные элементы HTML5 предлагает новые элементы для лучшей структуры документа: <article> Определяет статью в документе <aside> Определяет …

HTML5 Canvas

HTML5 Canvas На этом уроке мы научимся пользоваться новым элементом <canvas>. Canvas— элемент HTML5, предназначенный для создания растрового двухмерного изображения при помощи скриптов, обычно на языке JavaScript. Вставляем в наш блокнот: Вот, что у нас получилось:   Рисуем линию: Вот, что у нас получилось: Рисуем круг: Вот, что у нас получилось: Рисуем текст: Вот, что у нас получилось: …

HTML5 семантические элементы

HTML5 семантические элементы Семантика — это изучение значений слов и фраз в языке. Семантические элементы = элементы со смыслом. Что такое семантические элементы? Семантический элемент четко описывает его значение как для браузера, так и для разработчика. Примеры несемантических элементов: <div> и <span> — ничего не говорит о его содержимом. Примеры семантических элементов: <form>, <table> и …

Новые элементы в HTML5(часть 2)

Новые элементы в HTML5 На этом уроке мы познакомимся с новыми элементами в HTML5 <canvas> создает область, в которой при помощи JavaScript можно рисовать разные объекты, выводить изображения, трансформировать их и менять свойства. При помощи этого тега можно создавать рисунки, анимацию, игры и др. Вот, что у нас получилось: <audio> добавляет, воспроизводит и управляет настройками …

Новые элементы в HTML5(часть 1)

Новые элементы в HTML5 На этом уроке мы познакомимся с новыми элементами в HTML5 Тег <article> задает содержание сайта вроде новости, статьи, записи блога, форума или др. Вот, что у нас получилось: Тег <header> задает «шапку» сайта или раздела, в которой обычно располагается заголовок. Вот, что у нас получилось: <footer> – футер, он же подвал сайта – это блок …

Основные теги HTML5

Основные теги HTML5   На этом уроке мы научимся пользоваться основными тегами в HTML5.   Открываем блокнот: Теги <img> и src. Тег <img> используется для добавления фото на сайт, а src помогает добавить имя файла. width и height обозначают размер фотографии Вот, что у нас получилось:  На этом уроке мы научились пользоваться основными тегами в HTML5.

Введение в HTML5

Введение в HTML5 На этом уроке мы научимся создавать сайт. Открываем блокнот. Вставляем данные с картинки: Элемент <!DOCTYPE> предназначен для указания типа текущего документа. Тег <html> является контейнером, который заключает в себе все содержимое веб-страницы. Тег <head> предназначен для хранения других элементов, цель которых — помочь браузеру в работе с данными. <title> определяет заголовок документа. Элемент <body> предназначен для хранения содержания веб-страницы, отображаемого в …

Как изменить цвет кнопки в форме

Как изменить цвет кнопки в форме  На этом уроке мы научимся изменять цвет кнопки в форме. Для начала создадим html файл и запишем в нем все так, как показано на скриншоте. 2. Далее сохраняем наш html файл так, как показано на скриншоте. 3. Чтобы посмотреть результат, открываем файл в браузере.

Как в списке вывести римские числа?

Как в списке вывести римские числа? На этом уроке мы научимся выводить римские числа в списке. 1. Открываем блокнот.       2. Вводим данные с картинки.         3. Сохраняем блокнот.           4. Смотрим полученные результаты в браузере.

Как сделать, чтобы цвет рамки вокруг изображения-ссылки менялся при наведении на него курсора мыши?

Как сделать, чтобы цвет рамки вокруг изображения-ссылки менялся при наведении на него курсора мыши? На этом уроке мы научимся изменять цвет рамки вокруг изображения при наведении на него курсора мыши. Открываем блокнот: Псевдокласс hover отвечает за изменение стиля элемента при наведении на него указателя мыши. Для управления стилем ссылок этот псевдокласс добавляется к селектору A. Если тег <img> поместить …