|   
 
 
 
 
 
 
   
  Поиск по сайту:
логин : пароль :  
    Напомнить пароль?    
Реклама
Популярные статьи
    Реклама
     

    Текстовые гиперссылки в HTML

    Уроки веб-дизайна » HTML » Гиперссылки
     
     
     

    Гиперссылка - это указание для браузера, к какому объекту в пределах или за пределами HTML-документа он должен обратиться. С помощью гиперссылок пользователи могут переходить из одной страницы на другую, загружать файлы и т. д.. Как гиперссылка может быть оформленн фрагмент текста или рисунок (графический файл). Когда веб-страница отображается в окне браузера, текстовая ссылка обычно выделена синим цветом и подчеркиванием. Однако это далеко не всегда так. Для перехода в место, на которое указывает ссылка, пользователю достаточно щелкнуть её текст.

    Для создания гиперссылки необходимо использовать тэги <a> и </a>, определив для тега <a> атрибут HREF. Его значением должен быть адрес URL, на который указывает ссылка. Текст ссылки располагают между тегами <a> и </a>.

    Если веб-страница, на которую указывает ссылка, размещенная на другом сайте, то значением атрибута HREF должен быть полный URL-адрес с названием протокола включительно; такие ссылки называют внешними. Если же гиперссылка указывает на другую страницу того же сайта, то для поиска документа достаточно задать лишь относительный путь; такая ссылка называется внутренней.

    Гиперссылка может указывать на определенное место внутри страницы, если туда предварительно встроить якорь-метку. Для определения якоря также используют теги <a> и </a>, но вместо атрибута HREF задают атрибут NAME, значением которого должно быть имя якоря. Оно может состоять из букв и цифр, но не должно содержать символов пробела. Если на странице есть несколько меток, то все они должны иметь разные названия.

    Для создания ссылки на установленный якорь нужно в теге <a> указать его имя в конце адреса URL после имени документа, отделив его символом #. Символ # означает, что после него записано название метки, а не имя файла.

     

    Ссылка на метку внутри текущего документа задают так:

     

    <a href="#название_метки">Текст ссылки</a>

     

    Если в атрибуте HREF задать адрес электронной почты со словом mailto: перед ней, то после выбора такой ссылки можно отправить сообщение, где в поле "Кому" будет записан этот адрес.

    В примере, который приводится ниже, рассмотрено применение гиперссылок различного типа.

     

     HTML-документ, в котором используются гиперссылки и якоря:



    <p>Новые версии стандртных программ для операционной системы Windows а также драйвера можно найти на веб-сайте компании<a href="http://www.microsoft.com/">Microsoft</a>.

    <br />

    <br />

    A теперь можно перейти на <a href="/index.php">главную страницу сайта</a>.

    <br />

    <br />
    Про то как выйти со мной на связь вы сможете узнать <a href="#yanukovich">в конце этой страницы</a>.

    <br />

    <br />

    Можно использовать материалы, которые размещены <a href="text.doc">в этом текстовом документе</a>.
    <br />

    <br />
    <a name="yanukovich" href="mailto:yanukovich@zaraza.ru">yanukovich@zaraza.ru</a></p>

     

    Так будет выглядеть HTML-документ после его воспроизведения браузером:

     

    Новые версии стандртных программ для операционной системы Windows а также драйвера можно найти на веб-сайте компании Microsoft.

    A теперь можно перейти на главную страницу сайта.

    Про то как выйти со мной на связь вы сможете узнать в конце этой страницы.

    Можно использовать материалы, которые размещены в этом текстовом документе.

    yanukovich@zaraza.ru



    В этом примере слово «Microsoft» содержится в теге внешней гиперссылки, а текст «главную страницу сайта» - в теге внутренней ссылки. Текст «в конце этой страницы» размещен в теге ссылки на якорь, а «в этом текстовом документе» - в теге гиперссылки с атрибутом HREF, в котором мы задали связь не с веб-страницей, а с текстовым документом, который сохранен в той же папке, что и текущий HTML-документ. Текст «yanukovich@zaraza.ru» располагаются в теге, описывающий метку якоря, а в атрибуте HREF указан адрес электронной почты.

    Если посетитель страницы воспользуется внешней ссылкой Microsoft, то откроется страница, содержащаяся по адресу: http://www.microsoft.com/. После щелчка гиперссылки «главную страницу сайта» откроется главная страница сайта. После щелчка на внутреннюю ссылку в текстовом документе откроется окно с текстовым документом text.doc, содержащейся в текущей папке. Если воспользоваться ссылкой на якорь в конце этой страницы, то изображение текущей страницы сместится так, что текст метки «yanukovich@zaraza.ru», с которой связан якорь, будет размещен в видимой на экране части документа.

    Место текста «yanukovich@zaraza.ru» является гиперссылкой, воспользовавшись которой, пользователь сможет отправить письмо с помощью настроенной на компьютере электронной почты по указанному в атрибуте HREF адресу - yanukovich@zaraza.ru.

    Рассмотрим еще один пример создания текстовых гиперссылок. Предположим, что в определенной папке сохранено два HTML-документы, описывающие два направления работы фирмы, - 1.html и 2.html.

     

    Создадим список гиперссылок, каждое из которых иллюстрирует одно из направлений работы фирмы:

     

    <h1><a href="l.html">Наша продукция</a></h1>
    <h1><a href="2.html">Наши заказчики</a></h1>

     

    Результат:

    Наша продукция

    Наши заказчики

     

    В этом примере таги гиперссылок содержатся в тегах заголовков первого уровня. Тексты гиперссылок будут расположены в отдельных строках и оформлены как заголовки первого уровня.

    По умолчанию текстовые гиперссылки отображаются синим цветом и подчеркнуты, а если ими уже воспользовались, то темно-красным. Для изменения этих цветов добавим соответствующие атрибуты в теге <a>: <a link="magenta" alink="yellow">. Это означает, что после первой загрузки страницы все гиперссылки будут фиолетового цвета, а если посетитель воспользуется одним из них, то цвет его текста станет желтым. Это удобно, когда на странице есть много ссылок, и посетитель желает по очереди просмотреть их: тогда подставления другого цвета посещенным гиперссылкам позволяет систематизировать такой просмотр.


     
       
     
     
      Материал по теме:
     
     
     
     
     
    Сайт о животных | Отдых в Феодосии
    Копирование и распостранение материалов на другие сайты строго запрещено!
      Яндекс.Метрика