Следующая статья: Как создать таблицу в html - урок первый и простой
Содержание
Гипертекстовая ссылка
Аббревиатура HTML значит «Язык разметки гипертекста». Что все-таки такое гипертекст?
В отличие от обычного текста, который можно читать только от начала к концу, гипертекст позволяет производить моментальный переход от 1-го куска текста к другому. Справочные системы многих программных товаров построены конкретно по принципу гипертекста. При щелчке левой кнопкой мыши на неком выделенном цветом и подчеркнутом куске текущего документа - гипертекстовой ссылке - происходит переход к заблаговременно назначенному документу либо куску документа. На web страничках гипертекстовые ссылки обширно употребляются для перехода к определенному куску текущей странички, к последующей либо хоть какой страничке web сайта либо к документу другого web сайта.
Для задания перехода по ссылке в языке HTML употребляются теги <a></a> с атрибутом href, значением которого является адресок перехода. В качестве адреса может употребляться название файла другого документа либо url адресок.
Каждый компьютер, присоединенный к Веб, имеет собственный уникальный адресок, который может быть представлен либо в числовом виде, к примеру, 204.146.46.133, либо определенным сочетанием знаков, к примеру, www.microsoft.com. Так как каждый компьютер имеет свою уникальную структуру каталогов и файлов, то и любая web страничка также имеет уникальный адресок, именуемый URL (Uniform Resource Locator - Унифицированный указатель ресурсов). Как видно из наименования, URL может указывать не только лишь на странички Web, но также и на другие ресурсы Интернет, к примеру, FTP (File Transfer Protocol - Протокол передачи файлов) - хранилища файлов. В самом общем виде URL содержит в себе указатель на протокол, который применяется для доступа к ресурсу - http, ftp и другое - и символьный адресок компьютера в купе с именованием определенного файла в структуре каталогов этого компьютера. К примеру, url адресок www.chat.ru/user/faq.html состоит из указателя на протокол http, который применяется для доступа к Web, имени компьютера chat.ru и имени файла-документа faq.html, который находится в каталоге user.
Ссылка в html файле
Из произнесенного следует, что каждой web страничке соответствует собственный HTML файл. Но вы сможете увидеть, что в почти всех url адресах отсутствует название файла, к примеру, microsoft.com. Все же, в окне браузера все таки возникает определенная страничка. Дело в том, что админы web серверов могут указать на собственных узлах некие HTML файлы, которые выводятся по умолчанию, если название файла в URL очевидно не задано. Обычно эти файлы имеют имена index.html либо index.htm.
Поглядим, как сделать переход по ссылке с конца текущего документа list.html на первую страничку нашего web сайта, другими словами к файлу other.html. Чтоб сказать гостю web сайта о способности возвратиться к первой страничке, нужно предугадать меж открывающим <а> и закрывающим </а> тегами соответственный текст, к примеру:
<а href="other.html">На первую страничку</а>
Направьте внимание, что адресок ссылки должен быть заключен в кавычки, потому что некие браузеры могут не осознать его без кавычек.
Чтоб ссылка На первую страничку была центрирована, следует ограничить элемент <а>…</а> тегами <center> и </center>.
Воткните в файле list.html пустую строчку перед закрывающим тегом </body> и введите в ней последующий код:
<a href="other.html">Ha первую страничку</a>
Ссылка «На первую страничку» будет подчеркнута и выделена другим цветом - таким, который предусмотрен в вашем браузере для не просмотренных ссылок.
Установите указатель мыши в окне браузера на ссылке «На первую страничку».
Щелкните мышью на этом месте. В окне браузера появится первая web страничка из файла other.html.
Таким способом, мы выполнили переход по ссылке на другую страничку web сайта.
Сейчас сделаем ссылку для перехода с первой странички - other.html - на вторую - list.html. Для ссылки логичней всего будет использовать текстовый кусок о нашей деятельности, потому что перечень на второй страничке открывает содержание конкретно этого куска текста. Потому нам необходимо в файле other.html поместить открывающий тег <а> с атрибутом href="list.html" перед куском текста о нашей деятельности, а закрывающий тег </а> - после него.
Откройте файл other.html. Отредактируйте этот файл, вставив тег <а href="list.html"> перед текстом о нашей деятельности, а закрывающий тег </а> - после него.
Как раскрасить ссылки
Вероятнее всего, что когда вы просмотрите итог в браузере, вы обнаружите, что ссылка о нашей деятельности видна очень плохо либо в общем не видна. Это связано с тем, что цвет, которым браузер показывает не просмотренные ссылки, совпадает с цветом фона вашего документа. В таком случае цвет ссылок следует поменять, воспользовавшись атрибутами link и vlink тега <body>. Атрибут link определяет цвет не просмотренной ссылки, a vlink - просмотренной. Очередной атрибут - alink определяет цвет ссылки в момент, когда на ней установлен указатель мыши и нажата левая кнопка.
Установим для не просмотренной ссылки белоснежный цвет (white), для просмотренной - зеленый (lime), а для ссылки в момент щелчка мышью - красноватый (red).
Если вы устанавливаете какой-нибудь из атрибутов: bgcolor, text, link, vlink, alink - то устанавливайте их все. По другому, к примеру, установленный вами фоновый цвет может совпасть с цветом текста, установленным пользовательом в браузере.
Отредактируйте файл other.html, добавив в тег <body> атрибуты link="white", vlink="lime", alink="red" так, чтоб этот тег имел последующий вид:
<body bgcolor="blue" text="yellow" link="white", vlink="lime", alink="red">
Сейчас в программке просмотра ссылка верно видна.
Внимание! Теги bgcolor, text, link, vlink, alink являются устаревшими и потому безотступно рекомендуется использовать стили
Щелкните мышью на ссылке о нашей деятельности. В окно браузера будет загружен файл list.html.
Перейдите в конец этой странички, чтоб показать на дисплее ссылку На первую страничку.
Если ссылка плохо видна, вы сможете воткнуть для текущей странички в теге <body> атрибуты link, vlink и alink с подходящими значениями цветов.
Щелкните мышью на ссылке На первую страничку. В окне браузера снова появится документ other.html.
Воткнуть переход в документе можно не только лишь с текстовой ссылки, но также и с рисунка. Поглядим, как воткнуть переход с рисунка на вторую страничку. Направьте внимание: пока переход не вставлен, указатель мыши при установке на рисунке имеет форму стрелки.
Для сотворения таковой ссылки довольно в файле other.html воткнуть открывающий тег <а href="list.html"> перед тегом <img src="image.gif"> и закрывающий тег </а> после него.
Отредактируйте файл other.html.
В окне браузера вокруг рисунка вы увидите узкую рамку.
Установите указатель мыши на рисунке. В строке состояния браузера возникает адресок, на который ссылается набросок.
Щелкните мышью на рисунке. В окне браузера раскроется документ list.html.
Перейдите к ссылке На первую страничку и щелкните на ней мышью. В браузер опять будет загружена страничка other.html.
Создавая в этом опыте ссылки на странички нашего web сайта, мы использовали в качестве адреса название файла. При таком указании адреса браузер всегда отыскивает файл в текущем каталоге. Если б подходящий файл - list.html - находился, представим, в подкаталоге Doc текущего каталога, то в адресе нужно было бы указать путь к нему от текущего каталога: <а href="doc_list.html">. Такая ссылка, в какой адресок указывается относительно текущего каталога на том же компьютере, именуется относительной.
Варианты ссылок
Вы сможете также использовать в ссылках полный url адресок, указывающий на файл, находящийся в определенном каталоге определенного компьютера в сети, к примеру: http://www.intel.com/help/index.html. Такая ссылка именуется абсолютной. В то время как относительные ссылки указывают на файлы, расположенные на том же самом компьютере, абсолютные ссылки служат для представления адресов документов на других компьютерах в Интернет.
Представим, файл с именованием price.xls находится на web сайте sd-company.su в каталоге uploads/price. Тогда абсолютная ссылка на этот файл будет таковой: http://www.sd-company.su/uploads/price/price.xls
<а href="http://www.sd-company.su/uploads/price/price.xls">
При щелчке мышью на таковой ссылке браузер подключится к обозначенному web сайту, отыщет подходящий файл и выведет на экран диалог с предложением сохранить этот файл на диске вашего компьютера. После того, как вы укажете папку для сохранения, начнется процесс копирования файла на ваш компьютер.
Видео: «Команда КВН «ПриМа» танец Медведева (эксклюзив)»
Танец- воспоминание о выпускном вечере
