Web-программирование для детей. Ссылки, списки и видео в html.

Автор Maksim Inshakov
Web-программирование для детей. Ссылки, списки и видео в html.

Привет сегодня на примере создания видеотеки я расскажу про ссылки в списке и про видео на веб страницах видеотека в нашем случае — это такой список видео которые хранятся у нас на компьютере нажимаю на строчку с названием этого списка у нас должно открыться другая web-страница где можно посмотреть выбранное видео почти как на сайте YouTube только намного проще сперва свой список видео файлов для этого, что есть у или я сделаю четыре строчки вот так так у означает список отелей его элементы его строки после сохранения изменений наши.

Как выглядит вот так по моей задумке нажатием на каждую строчку должны открыться новая страничка с моим видео для этого каждой строчке должна стать активной ссылки для перехода с этой страницы на другую, а делается — это с помощью вот этого парного тега. Но сперва нужно. Создать страницы на которые будут вести ссылки.

Пусть File Index HTML который напиши код будет лежать в папке в 5 в этой же папке создадим ещё три папки вот так самая.

Верхняя для новых страничек с видео 2 для рисунков. А 3 для самих видео файлов в самой верхней полки создадим четыре файла HTML вот так код в этих HTML файлах будет почти одинаковые отличие только в заголовке имени файла и имени видеофайла. Обратите внимание как написано. Путин рисунка и видеофайла более подробно — это будет в одном из будущих видео при помощи фотограф видео на веб странице помещается проигрыватель видео файлов при помощи указанного рисунка делать заставку перед проигрыванием видео, но можно обойтись и без него. А здесь указывается путь к wi-fi который будет показан проигрыватель аналог страницы в браузере интернет. Эксплорер могут быть проблемы при использовании этого видео на странице не появится проигрыватель и вы не увидите видео чтобы этого избежать вот здесь нужно добавить такой метод — это вернемся к нашему первым файл с кодом Index HTML здесь в стиле для торговли я увеличила размер шрифта и высоту строчек правила действуют только на строчке списка, а строчки списка я добавила ссылки на странички с видеофайлами, а точнее с проигрывателем видео. Давайте проверим, что получилось теперь при нажатии на любую из этих строчек можно попасть на любую другую страничку и посмотреть видео можно вернуться назад и посмотри другое видео. Давайте главную страничку сделаем более красивее при помощи этого свойства уберём маркеры слева от списка. А эти правила будут действовать только на ссылке здесь я убрала подчёркивание у ссылки. А здесь сделать чёрный цвет. Для текста ссылки по умолчанию он был синий. Обратите внимание как ведут себя эти строки ссылки когда над ними проводишь в раствор мыши ничего не происходит смена курсора мыши если добавить — это и задать ним другой цвет текста то при попадании курсора мыши на такую ссылку цвет текста этой ссылке должен измениться вот так ведь и. Как меняется цвет и как он принимает свой прежний вид когда уходишь в курсор мыши. Сегодня мы познакомились со списками которые ведут от 1 до подстрижки к другой и с добавлением видео в HTML можно использовать не только для перечисления чего-то на сайтах их часто применяют для создания вертикальных и горизонтальных меню. А как так сделать мы рассмотрим в одном из будущих видео. Всем пока, а строчки сроки с ссылками. А здесь отдала чёрный цвет для ссылки текста. Ну говори списке можно использовать для добавления другого чего-то все. Всем пока.

0 комментариев
0

Читайте также