Веб-разработка. Создаем свою википедию. Часть 2.
Привет капибаряне! Не выпустил я пост в ту пятницу, но наверстываю пропущеные дни. В прошлом посте мы начали создавать свою википедию, поняли, что это не сложно и узнали новые теги. Но некоторые вещи все еще остались незаконченными. Давайте их разберем!
Наш план на сегодня:
- Добавить фото и видео в раздел "Медиа"
- Добавить навигацию по странице
- Некоторые косметические элементы
Начнем!
Откроем наш код. Начнем с того, что добавим изображения и видео на наш сайт в разделе медиа. Для этого нам нужно загрузить нужные фото и видео в одну папку с вашими скриптами, как указано на фото:
За шакалов извините(.
Я бы советовал переименовывать изображения для удобства.
Итак, запоминаем новый тег, который послужит для добавления фото на сайт.
Разберем этот тег:
src="" - атрибут, который дает ссылку на фото, которое нужно добавить на сайт, внутри кавычек нужно добавить название файла с расширением, например, kapibara.jpg.
alt="" - атрибут, который работает в случае, если браузер не может найти или обработать фото. Вместо него он говорил нам, что это за фото. Так он работает///
Weight и height обозначают высоту и ширину, все просто.
Перед созданием навигации расфасуем все пункты по id и дадим им свои классы. Запоминаем новый атрибут - id.
Подобным образом создаем id. (вместо class - id)
Теперь, давайте добавим навигацию по сайту. Для создания навигации используем ранее изученный нами тег -
- . Ведь навигация у нас в виде листа. Внутри
- создаем несколько пунктов листа -
Внутри пунктов добавляем следующую конструкцию:
href - говорит, куда отсылать нас
а между тегами мы пишем, что должно быть написано вместо ссылки.
Вроде все, ах да..!
Помните те линии в Википедии после заголовков? Чем наша Капипедия хуже? Тег создает линию. Прописываем ее после заголовков.
Спасибо за внимание к посту! Надеюсь вам понравилось, ну а я пойду капибарить новый пост, всем пока.
Комментарии