Добавляем ссылку HTML
Добавляем ссылку на HTML-страницу
В этом уроке, мы рассмотрим способ добавления ссылки на HTML-страницу.
Ссылка — важнейшая часть сайта и всемирной паутины, именно благодаря ссылкам мы можем путешествовать по интернету.
Так как ссылки обычно ссылаются на другие страницы, то нам нужно создать еще одну HTML-страницу и сослаться на неё.
У нас уже есть одна страница Страница о снежном барсе (файл index.html), давайте создадим еще одну HTML-страницу, она будет посвящена полярному волку.
Страница о полярном волке
Создайте на Рабочем столе HTML-файл:
polayrnyi-volk.html
Название страницы <title> </title>, сделайте:
Страница о полярном волке
Внедрите в неё, следующий CSS-код:
<style> h1 { color: green; font-family: Arial; } p { color: blue; font-size: 19px; width: 60%; }</style>Заголовок статьи <h1> </h1>:
Полярный волк
Фотография <img>:
Cтатья состоящая из двух абзацев <p> </p>:
Полярный арктический волк - подвид волка. Обитает в Арктике и тундре, наобширных пространствах северных регионов, которые пять месяцев в году,погружены в темноту. Чтобы выжить, волк приспособился есть практическилюбой корм, который только попадается ему на пути. Полярные волки хорошо усвоились к жизни в Арктике: они могут годамижить при минусовой температуре, месяцами не видеть солнечного света инеделями оставаться без пищи. Длина волка составляет 100-150 см, высотав холке может достигать 100 см, а масса у самцов переваливает за 100 кг.Продолжительность жизни полярного волка около 7 лет. В его рацион входят:леминги, зайцы, овцебыки, олени и птицы.Полный код HTML-документа, страницы о полярном волке, приведён в конце этого урока.
Добавляем ссылку в HTML-документ
Добавим ссылку которая будет ссылаться на страницу о полярном волке, саму ссылку разместим на странице о снежном барсе.
Ссылка в HTML-документ добавляется с помощью тегов <a> </a>, между которыми помещают текст ссылки. У тега <a> есть свойство href=" ", значением которого выступает адрес страницы, на которую нужно сослаться (кликнув по ссылке мы перейдем на страницу, на которую ссылается ссылка):
<a href="адрес страницы">Текст</a><a> — открывающий тег ссылки, который указывает на то что здесь будет ссылка,
href=" " — свойство тега <a>, которое указывает на адрес страницы,
адрес страницы — значение свойства href=" ", адрес страницы,
Текст — любой текст,
</a> — закрывающий тег ссылки.
Добавьте в HTML-документ файла index.html (Страница о снежном барсе), перед закрывающим тегом </body>, следующий код:
<a href="polyarnyi-volk.html">Полярный волк</a>Так как файлы index.html и polyarnyi-volk.html находятся в одной папке Рабочий стол, то адресом страницы о полярном волке, будет просто имя его файла polyarnyi-volk.html
В качестве Текста можно написать всё что угодно, но обычно пишут текст описывающий страницу на которую ссылается ссылка, в нашем случае это Полярный волк.
В итоге, HTML-документ файла index.html будет выглядеть следующим образом:
<html> <head> <title>Страница о снежном барсе</title> <style> h1 { color: green; font-family: Arial; } p { color: blue; font-size: 19px; width: 60%; } </style> </head> <body> <h1>Снежный барс</h1> <img src="irbis.jpg"> <p> Снежный барс (ирбис, ак барс) - крупное хищное млекопитающее из семейства кошачьих. Обитает в горных массивах Афганистана, Бирмы, Бутана, Индии, Казахстана, Киргизстана, Китая, Монголии, Непала, Пакистана, России, Таджикистана и Узбекистана. Ирбис отличается тонким, длинным, гибким телом, относительно короткими лапами, небольшой головой и очень длинным хвостом. Длина снежного барса вместе с хвостом составляет 200-230 см, вес до 55 кг. Окраска меха светлая, дымчато-серая с кольцеобразными или сплошными тёмными пятнами.</p> <p> Охотится снежный барс, в основном, на горных козлов и баранов, также в его рационе встречаются кабаны, фазаны и даже суслики. В силу труднодоступности местообитания вида, ирбисы до сих пор остаются малоизученными. Однако по приблизительным оценкам их количество варьируется в районе около 10 тысяч особей. По состоянию на 2013 год, охота на снежных барсов повсеместно запрещена.</p> <a href="polyarnyi-volk.html">Полярный волк</a> </body></html>Внизу страницы находится ссылка, нажав на которую вы попадёте на страницу о полярном волке. Как вы можете заметить, на странице о полярном волке, нету ссылки. Давайте добавим туда ссылку, которая будет ссылаться на страницу о снежном барсе.
Добавьте в HTML-документ файла polyarnyi-volk.html, перед закрывающим тегом </body>, следующий код:
<a href="index.html">Снежный барс</a>В итоге, HTML-документ файла polyarnyi-volk.html будет выглядеть следующим образом:
<html> <head> <title>Страница о полярном волке</title> <style> h1 { color: green; font-family: Arial; } p { color: blue; font-size: 19px; width: 60%; } </style> </head> <body> <h1>Полярный волк</h1> <img src="polyarnyi-volk.jpg"> <p> Полярный арктический волк - подвид волка. Обитает в Арктике и тундре, на обширных пространствах северных регионов, которые пять месяцев в году, погружены в темноту. Чтобы выжить, волк приспособился есть практически любой корм, который только попадается ему на пути.</p> <p> Полярные волки хорошо усвоились к жизни в Арктике: они могут годами жить при минусовой температуре, месяцами не видеть солнечного света и неделями оставаться без пищи. Длина волка составляет 100-150 см, высота в холке может достигать 100 см, а масса у самцов переваливает за 100 кг. Продолжительность жизни полярного волка около 7 лет. В его рацион входят: леминги, зайцы, овцебыки, олени и птицы.</p> <a href="index.html">Снежный барс</a> </body></html>Внизу страницы находится ссылка, нажав на которую вы попадёте на страницу о снежном барсе.
Нажимая по ссылкам расположенным на страницах, вы будете переходить от снежного барса к полярному волку и наоборот.