В этом уроке вы научитесь создавать ссылки — переходы с одной страницы на другую.

Что необходимо для создания ссылки?

Для создания ссылки вы используете то же, что и всегда при кодировании HTML: тэг. Простой тэг с одним элементом и одним атрибутом — и вы можете перейти куда угодно. Вот пример того, как может выглядеть ссылка на Pokompam.by:

Пример 1:

 Это ссылка на new.pokompam.by

будет выглядеть в браузере:

Это ссылка на pokompam.by

Элемент a обозначаетякорь/anchor». Атрибут href это сокращение отhypertext reference/гипертекстовая ссылка», специфицирующий место, на которое выполняется переход по данной ссылке — обычно это internet-адрес и/или имя файла.

В примере атрибут href имеет значениеhttps://www.html.net», которое является полным адресом HTML.net и называется URL (Uniform Resource Locator/универсальный локатор ресурса). Обратите внимание, что»https://всегда должно входить в состав URLов.

Слова

Это ссылка на HTML.netэто текст, который показывается в браузере как ссылка. Не забудьте закрыть тэг .

Как насчёт ссылок между моими собственными страницами?

Если вы делаете ссылки между страницами на одном web-сайте, то не нужно указывать полный адрес (URL) документа. Например, если у вас две страницы (назовём их page1.htm и page2.htm), сохранённые в одной папке, вы можете сделать ссылку с одной страницы на другую, просто напечатав имя файла в ссылке. То есть ссылка с page1.htm на page2.htm будет выглядеть так:

Пример 2:


                        Щёлкните здесь для перехода на page 2

Если page 2 помещена в подпапкуsubfolder», ссылка выглядит так:

Пример 3:


                        Щёлкните здесь для перехода на page 2

В обратную сторону ссылка со страницы page 2 (в подпапке subfolder) на page 1 будет такой:

Пример 4:


                        Ссылка на page 1

Сочетание../указывает на папку, расположенную на один уровень выше от данной позиции файла, с которого делается ссылка. Следуя этой логике, вы можете также указать на два уровня выше../../или более.

Разобрались? Альтернативно вы всегда можете указать полный адрес файла (URL).

А ссылки внутри страницы?

Вы можете также создавать ссылки-переходы внутри самой страницы — например, оглавление со ссылками на главы. Всё, что вам необходимо, — использовать атрибут id и символ#».

Используйте атрибут id для маркировки элемента, на который вы хотите сделать переход. Например:

heading 1

Теперь можно создать ссылку на этот элемент с помощью знака#в атрибуте ссылки. Знак#сообщает браузеру, что это переход на той же самой странице. После#должен следовать id тэга, на который выполняется переход. Например:


                        Ссылка на heading 1

Всё станет понятнее на примере:

Пример 5:


                        
        
                                 
                                 
 
                                 
 
                                
Ссылка на heading 1


                                
Ссылка на heading 2

heading 1

                                
Text text text text

heading 2

                                
Text text text text

выглядит в браузере (щёлкните по ссылкам):

Heading 1

Text text text text

Text text text text

(Примечание: атрибут id должен начинаться с буквы)

Вы можете также сделать ссылку на e-mail адрес почти так же, как в ссылке на документ:

Пример 6:

 Ссылка на new.pokompam.by

будет выглядеть в браузере:

pokompam.by

Атрибут title используется для краткого описания ссылки. Если вы — не щёлкая мышью — поместите её указатель над ссылкой, вы увидите, как появится текстПосещайте HTML.net и изучайте HTML».