HTML 5, CSS 3 и Web 2.0. Разработка современных Web-сайтов - [26]
— Если нажать клавишу
— Если нажать клавишу
— Если нажать комбинацию клавиш
Порядок, в котором выполняется перенос фокуса ввода с одной гиперссылки на другую при нажатии клавиш
32 767 — номер в порядке обхода.
— Если указан положительный номер, именно он будет определять порядок обхода. Иными словами, сначала фокус ввода получит гиперссылка с номером 1, потом — с номером 2, далее — с номером 3 и т. д.
— Если указан номер, равный нулю, обход будет осуществляться в порядке, в котором гиперссылка определена в HTML-коде Web-страницы. Фактически ноль — значение атрибута тега TABINDEX по умолчанию.
— Если указан отрицательный номер, данная гиперссылка вообще исключается из порядка обхода. До нее невозможно будет добраться с помощью клавиатуры — можно будет только щелкать мышью.
Рассмотрим небольшой пример:
Этот HTML-код создает три гиперссылки с "обратным" порядком обхода. Сначала фокус ввода получит гиперссылка "Страница 3", потом — "Страница 2" и напоследок — "Страница 1".
Графические гиперссылки
В начале этой главы говорилось, что гиперссылка может быть в виде не только фрагмента текста, но и картинки или даже представлять собой фрагмент графического изображения. Вот графическими гиперссылками мы сейчас и займемся.
Изображения-гиперссылки
Язык HTML позволяет использовать в качестве содержимого гиперссылки любой фрагмент любого блочного элемента, в том числе и графическое изображение, т. е. создать изображение-гиперссылку.
Для создания изображения гиперссылки достаточно поместить внутрь тега тег :
Этот HTML-код создает изображение-гиперссылку, указывающую на Web-сайт организации W3C. А в качестве самого изображения выбран логотип этой организации, который мы сохранили в файле в той же папке, где находится файл текущей Web-страницы.
А этот HTML-код создает почтовую изображение-гиперссылку.
Правила вывода изображений-гиперссылок Web-обозревателем:
— изображение-гиперссылка окружается рамкой, имеющей соответствующий гиперссылке цвет: синий — для непосещенной, темно-красный — для посещенной и т. д.;
— при помещении курсора мыши на изображение-гиперссылку Web-обозреватель меняет его форму на "указующий перст", как и в случае текстовой гиперссылки.
Рамка вокруг изображения-гиперссылки зачастую выглядит непрезентабельно, поэтому ее обычно убирают, задав соответствующее представление. О представлении Web-страниц мы поговорим в части II.
Изображения-карты
А еще HTML позволяет превратить в гиперссылку часть графического изображения. Более того, мы можем разбить изображение на части, каждая из которых будет представлять собой гиперссылку, указывающую на свой интернет-адрес. Такие изображения называют изображениями-картами, а ее части-гиперссылки — "горячими" областями.
С помощью изображений-карт часто создают заголовки Web-сайтов, фрагменты которого представляют собой гиперссылки, указывающие на определенную Web- страницу. Пик популярности изображений-карт давно прошел, однако их еще можно довольно часто встретить.
Изображение-карту создают в три этапа. Первый этап — создание самого изображения с помощью хорошо нам знакомого тега :
Второй этап — создание карты, особого элемента Web-страницы, который описывает набор "горячих" областей изображения-карты. Сама карта на Web-странице никак не отображается.
Карту создают с помощью парного тега
ВНИМАНИЕ!
Здесь для описания формата тега
С помощью обязательного атрибута NAME тега
После создания карты следует привязать ее к созданному на первом этапе изображению. Для этого мы применим обязательный в данном случае атрибут USEMAP тега . Его значение — имя привязываемой к изображению карты, причем в начале этого имени обязательно следует поставить символ # ("решетка"). (В имени, заданном атрибутом NAME тега
