Главная страница Случайная страница
Разделы сайта
АвтомобилиАстрономияБиологияГеографияДом и садДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеталлургияМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРелигияРиторикаСоциологияСпортСтроительствоТехнологияТуризмФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника
Гипертекстовые ссылки
|
|
Как только в Web-страницу будет встроена гиперсвязь, документ можно назвать гипертекстом. Гиперссылка может указывать:
· на позицию в своем документе (внутренние гиперссылки),
- на другой документ на своем сервере,
- на произвольный объект по любому адресу Internet.
Внутренние гиперссылки применяются для того, чтобы упростить пользователю ориентацию в больших документах.
Гиперссылки могут быть оформлены как абсолютные или относительные. Для создания гиперссылки необходим адрес документа, на который устанавливается ссылка. Этот адрес называется URL - Uniform Resource Locator.
Абсолютный URL — это полный Internet-адрес со всей информацией, требуемой клиенту для того, чтобы отыскать сервер и успешно установить с ним связь.
Относительный URL используется для адресации в пределах документа или совокупности документов на одном сервере.
Полный Internet-адрес можно получить лишь тогда, когда к относительному адресу добавляется базовый. Web-браузер при необходимости в большинстве случаев сам добавляет необходимый базовый адрес, чтобы получить полный адрес в Internet.
Относительные URL используются обычно внутри HTML-документа, например, для того, чтобы организовать переход из оглавления к конкретной главе. Базовый адрес можно определить с помощью дескриптора < base> в заголовке HTML-документа.
Абсолютные URL следует использовать во всех тех случаях, когда вы ссылаетесь на документы другого сервера в Internet.
Гипертекстовая ссылка задается парным тегом < A>, который содержит обязательный атрибут HREF=. В качестве значения атрибута используется адрес URL документа, на который указывает ссылка. Она может указывать на произвольный документ, располагающийся на любом общедоступном узле сети, например:
< A HREF=https://www.site.com/index.htm>
Здесь задан адрес в абсолютной форме. Обычно в такой форме задается ссылка на внешний документ. При использовании относительного адреса ссылка рассматривается как внутреняя, например:
— Регулярная проверка качества ссылок по более чем 100 показателям и ежедневный пересчет показателей качества проекта.
— Все известные форматы ссылок: арендные ссылки, вечные ссылки, публикации (упоминания, мнения, отзывы, статьи, пресс-релизы).
— SeoHammer покажет, где рост или падение, а также запросы, на которые нужно обратить внимание.
SeoHammer еще предоставляет технологию Буст, она ускоряет продвижение в десятки раз, а первые результаты появляются уже в течение первых 7 дней. Зарегистрироваться и Начать продвижение
< A HREF=" text.htm" >
Достоинство внутренней ссылки в том, что она сохраняет свою работоспособность при изменении адреса Web-узла.
Дескриптор гиперсвязи < A> иногда называется «якорь» (само наименование дескриптора представляет собой аббревиатуру от английского слова anchor — якорь).
Полный формат гиперссылки включает возможность ссылки на определенное место внутри страницы. Для этого соответствующее место помечается с помощью якоря. Якорь задается тегом < A> с атрибутом name, например:
< A name=" MyLabel" >.
Значение этого атрибута - произвольная последовательность латинских букв и цифр, рассматриваемая как имя якоря. Для ссылки на якорь его имя указывается в конце адреса URL после символа " #":
< A HREF=https://www.site.com/index.htm#address>
Между дескрипторами < A> и < /A> могут находиться только текст, графика и заголовки. Текст, располагающийся между < A> и < /A> дескрипторами, обычно изображается браузерами в цвете (для этих целей по умолчанию используется голубой цвет), некоторые программы подчеркивают его. Посредством атрибутов в дескрипторе < body> цвет текста гиперсвязи можно изменить.
Основные дескрипторы для организации ссылок и форматирования текста:
| Дескриптор | Атрибут | Назначение |
| < a>, < /a> | href=URL | Адрес объекта |
| name=имя метки | Создание локального имени ссылки | |
| < b>, < /b> | Полужирный шрифт | |
| < base> | href=URL | Базовый URL |
| < basefont> | size=n | Размер шрифта |
| < big>, < /big> | Увеличение шрифта | |
| < body>, < /body> | Содержимое HTML-документа | |
| alink=Цвет | Цвет активизированной гиперсвязи | |
| background=URL | URL повторяющейся фоновой иллюстрации | |
| bgcolor=Цвет | Цвет фона | |
| link=Цвет | Цвет гиперсвязи | |
| text=Цвет | Цвет текста | |
| vlink=Цвет | Цвет посещенной гиперсвязи | |
| < br> | Принудительный разрыв строки | |
| < caption>, < /caption> | Заголовок таблицы | |
| < center>, < /center> | Центрирование фрагмента документа | |
| < em>, < /em> | Выделение текста | |
| < font>, < /font> | color=Цвет | Задание цвета шрифта |
| face=Шрифт | Вид шрифта | |
| size=n | +n | -n | Размер (абсолютный | относительный) | |
| < hn>, < /hn> | Уровень заголовков, где n = 1 - 6 | |
| < hr> | Горизонтальная линия | |
| align=Выравнивание | Выравнивание по горизонтали | |
| noshade | Выключение трехмерного изображения | |
| size=n | Высота линии в пикселях | |
| width=n | n% | Ширина линии | |
| < i>, < /i> | Курсив | |
| < li>, < /li> | Элемент списка | |
| value=n | Явное задание номера элемента | |
| < ol>, < /ol> | Пронумерованный список | |
| start=n | Начальный номер | |
| < p>, < /p> | Текстовый абзац | |
| align=Выравнивание | Выравнивание по горизонтали | |
| < small>, < /small> | Уменьшение шрифта | |
| < sub>, < /sub> | Нижний индекс | |
| < sup>, < /sup> | Верхний индекс | |
| < table>, < /table> | border=n | Определение таблицы с обрамлением |
| < td>, < /td> | Ячейка данных таблицы | |
| colspan=n | Захваченные столбцы | |
| rowspan=n | Захваченные строки | |
| < th>, < /th> | Ячейка заголовка таблицы | |
| colspan=n | Захваченные столбцы | |
| rowspan=n | Захваченные строки | |
| < tr>, < /tr> | Строка таблицы | |
| < ul>, < /ul> | Ненумерованный список |
В таблице использованы следующие обозначения:
- параметр Цвет задается шестнадцатеричным кодом #RRGGBB, где RR, GG, BB - соответственно красная, зеленая и синяя составляющие цвета, принимающие значения от 00 до FF. Чем больше значение, тем меньше насыщенность цвета. Стандартные цвета можно задать словом: Black, Silver, Gray, White, Red, Green, Yellow, Blue и другие;
- параметр Выравнивание может принимать значения Center;
- вертикальная черта " |" в описании атрибутов означает возможность выбора одного из атрибутов.
Символы <, >, & и " напрямую в тексте не отображаются. Для их изображения используются следующие коды:
- & lt — левая угловая скобка;
- & gt — правая угловая скобка;
- & amp — амперсанд;
- & quot — кавычки;
- & nbsp — непрерывный пробел.
Замечание: в этих кодах нельзя использовать заглавные буквы.
Рассмотрим примеры форматирования текста.
Пример 1
< font color=Red size=6 face=" Times New Roman" >
Пример управления шрифтом
< /font>
Браузер воспроизведет текст
" Пример управления шрифтом"
красным цветом, размером — 6, шрифтом Times New Roman.
Пример 2
< UL>
< LI> яблоки
< LI> бананы
< /UL>
Результатом воспроизведения является маркированный список:
· яблоки
· бананы
Пример 3
< OL>
< LI> апельсины
< LI> персики
< LI> виноград
< /OL>
Результатом воспроизведения является нумерованный список:
1. апельсины
2. персики
3. виноград
Пример 4
< table border=1>
< caption> Результаты измерений< /caption>
< tr>
< th> время< /th>
< th> температура< /th>
< th> давление< /th>
< /tr>
< tr align=right>
< td> 12: 00< /td>
< td> 26.00< /td>
< td> 12.800< /td>
< /tr>
< tr align=right>
< td> 12: 15< /td>
< td> 22.50< /td>
< td> 9.810< /td> < /tr>
< tr align=right>
< td> 12: 30
< /td> < td> 11.00
< /td>
< td> 1.650< /td>
< /tr>
< tr align=right>
< td> 12: 45< /td>
< td> 3.30< /td>
< td> 0.030< /td> < /tr>
< tr align=right>
< td> 13: 00< /td>
< td> 0.05< /td>
< td> 0.002< /td> < /tr>
< /table>
— Разгрузит мастера, специалиста или компанию;
— Позволит гибко управлять расписанием и загрузкой;
— Разошлет оповещения о новых услугах или акциях;
— Позволит принять оплату на карту/кошелек/счет;
— Позволит записываться на групповые и персональные посещения;
— Поможет получить от клиента отзывы о визите к вам;
— Включает в себя сервис чаевых.
Для новых пользователей первый месяц бесплатно. Зарегистрироваться в сервисе
Результатом воспроизведения этого примера будет таблица:
| Результаты измерений | ||
| время | температура | давление |
| 12: 00 | 26.00 | 12.800 |
| 12: 15 | 22.50 | 9.810 |
| 12: 30 | 11.00 | 1.650 |
| 12: 45 | 3.30 | 0.030 |
| 13: 00 | 0.05 | 0.002 |
Использование графики в HTML–документах
Рисунки являются очень важными элементами оформления WEB-страниц. Привлекательность и информативность сайтов в Интернет во многом определяется использованием графики. Рисунки, чаще всего, хранятся в файлах формата.jpg или.gif, обычно в отдельной папке (браузеры поддерживают и другие графические форматы). Кроме указанных форматов допускается использовать видеоизображения в формате.avi.
Подключение рисунков выполняется с помощью дескриптора < img>, имеющего следующие основные атрибуты:
· align=Выравнивание — способ выравнивания графики, например, Center;
· border=n — видимая рамка вокруг графики;
· dynsrc=URL — исходный URL видео;
· height=n — высота графики;
· loop=n — число повторений видео (если вместо n задано infinite, видео будет повторяться непрерывно);
· src=URL — исходный URL графики;
· start=Условие запуска — задает способ запуска видео, например, start=mouseover запускает видео при перемещении указателя мыши по области видео;
· width=n — ширина графики.
Рассмотрим пример добавления графики в HTML-документ.
Пример 5
Откроем редактор Блокнот и наберем следующий код:
< HTML>
< HEAD> < /HEAD>
< BODY>
< TABLE Border=1>
< TR> < TD colspan=2> < img src=" Car.jpg" > < /TD> < /TR>
< TR> < TD colspan=2>
< Font color=Red size=3 face=" Times New Roman" >
Двигатель внутреннего сгорания< /Font> < /TD> < /TR>
< TR> < TD> < img dynsrc=" Demo.avi" start=mouseover> < /TD>
< TD> < img dynsrc=" Demo.avi" loop=infinite> < /TD>
< /TR>
< /TABLE>
< /BODY>
< /HTML>
Сохраним код под любым именем с расширением.html или.htm, например, Example.html. Следует иметь в виду, что в соответствии с кодом, графика должна храниться в той же папке, где и Example.html. Двойной щелчок по значку Example.html воспроизведет приведенного кода в браузере Internet Explorer.
|
|