Как сделать ссылку далее в html

Как сделать ссылку далее в html

В этом уроке вы научитесь вставлять ссылку в HTML файл. Но давайте вкратце рассмотрим,  для чего нужна ссылка.

  • С помощью ссылки можно направить пользователя на другую страницу или на другой сайт.
  • С помощью ссылки можно дать возможность пользователю скачать файл или архив.

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

Я думаю, здесь все ясно. Теперь можно перейти к основной части темы «Как сделать ссылку в HTML».

Создать html ссылку - просто.  Чтобы создать html ссылку в документе, достаточно использовать простенький элемент с одним атрибутом:

<a href="адрес ссылки"> ссылка</a>

Чтобы было всем все понятно, давайте посмотрим пример:

Ситуация такая, у вас есть два html файла «1. html» и «2.html».
Задание: как сделать ссылку с файла «1. html» на файл «2. html»?

Создайте html файл с именем «1. html» с таким кодом:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Как вставить ссылку в html</title> </head> <body> Текст документа со <a href="2.html"> ссылкой на файл - 2 </a>. </body> </html>

Обратите внимание на пункт 9.  В ссылке прописан адрес другой страницы <a href="2.html">.

Создайте html файла с именем «2. html» с таким кодом:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Как вставить ссылку в html</title> </head> <body> Текст документа №2 со <a href="1.html"> ссылкой на файл - 1 </a>. </body> </html>

Результат:

При открытии файла «1. html»

Как сделать ссылку в HTML. Урок-5 (для начинающих)

откроется вот такой документ, как на примере снизу:

Как сделать ссылку в HTML.

Если перейти по ссылке, откроется файл «2. html».

Как сделать ссылку в HTML

[просмотреть пример]

Как сделать ссылку на почту в html?

<a href="mailto:">Написать письмо владельцу блога bloggood.ru</a>

Как сделать html ссылку на сайт?

<a href="http://bloggood.ru"> ссылка </a>

Как сделать html ссылку в новом окне?

<a href="ваша страница.html" target="_blank">ссылка</a>

Благодаря атрибуту target ="_blank", страница будет открываться в новом окне.

Как сделать цвет ссылки в html?

<body link="#000080" alink="#FFA500" vlink="#FF1493"> <a href="2.html">ссылка</a> </body>

- link - цвет просто ссылки
- alink - цвет нажатой ссылки
- vlink - цвет посещеной ссылки
- #000080; #FFA500; #FF1493; - это кода цвета ссылок

Кодировку цветов вы можете посмотреть тут.

Как сделать подсказку ссылки?
При наведении курсора мышки на ссылку, появится подсказка:

<a href="http://bloggood.ru" title="Главная страница блога"> Главная </a>

title="здесь подсказка ссылки".

Как сделать ссылку на файл?
Допустим, вам нужно скачать файл-архив «fail.zip».

<a href="fail.zip" target="_blank" title="скачать файл основы HTML"> Скачать </a>

title="скачать файл основы HTML" - подсказка
target="_blank" - ссылка откроется в новом окне.

Закрепим материал, и все сказанное выше в примерах слепим в одно целое.

Пример:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Как вставить ссылку в html</title> </head> <body link="#000080" alink="#FFA500" vlink="#FF1493"> Вот <a href="2.html">ссылка</a> на страницу №2. А это, ссылка на сайт <a href="http://bloggood.ru" target="_blank"> bloggood.ru </a> и она откроется в новом окне. Ну, а если навести курсор мышки на <a href="http://bloggood.ru" target="_blank" title="Привет!!! Как дела?"> эту ссылку </a>, тогда можно увидеть подсказку. <br> <a href="fail.zip" title="скачать файл">Скачать файл</a> <br> <br> <a href="mailto:">Написать письмо владельцу блога bloggood.ru</a> </body> </html>

[посмотреть пример]

Если что-то было не понятно или у вас возникли вопросы, пишите в комментариях. Отвечу быстро.

Переходим к следующему уроку - Как вставить ссылку-якорь в HTML

Понравился пост? Помоги другим узнать об этой статье, кликни на кнопку социальных сетей ↓↓↓

Последние новости категории: Похожие статьи Популярные статьи:

Добавить комментарий

Метки: html, основы


Как сделать ссылку далее в html


Как сделать ссылку далее в html


Как сделать ссылку далее в html


Как сделать ссылку далее в html


Как сделать ссылку далее в html


Из ленточек своими руками

Декор своими руками мастер класс декор своими руками

Городской рюкзак своими руками

Канзаши из лент своими руками пошаговая инструкция

Желтый шеллак на ногтях дизайн