Визуальный редактор Dreamweaver MX

         

Создание обычных гиперссылок


А создаются они очень просто. И в этом — большая заслуга разработчиков Dreamweaver, сделавших продукт, реализующий просто даже весьма сложные задачи.

Но хватит петь дифирамбы Dreamweaver. Давайте попробуем его в настоящем деле! Вставим в текст нашей пока что единственной Web-страницы две гиперссылки, указывающие "вовне" нашего сайта: на "домашний" сайт фирмы Macromedia — создателя Dreamweaver и на почтовый адрес гипотетического Ивана Ивановича. Щелкнув по первой из них, пользователь сможет попасть на сайт http://www.macromedia.com,

а щелкнув на второй — написать письмо Ивану Ивановичу. Второй ссылкой мы займемся чуть позже, а пока...

Выделим название фирмы Macromedia и обратим внимание на редактор свойств. Мы сразу заметим большое поле ввода интернет-адреса для гиперссылки (рис. 3.39).

Рис. 3.39. Поле ввода интернет-адреса в редакторе свойств

Все, что нам нужно сделать, — это ввести в него интернет-адрес сайта Macromedia и нажать клавишу <Entcr>. Результат появится сразу (рис. 3.40). Теперь при просмотре в Web-обозревателе пользователь может просто щелкнуть мышью по слову "Macromedia", чтобы перейти на "домашний" сайт этой фирмы.

Вы уже заметили, что после вставки гиперссылки слово "Macromedia" изменило свой цвет на синий и стало подчеркнутым, хотя мы явно не задавали для него никакого HTML-форматирования. Дело в том, что, согласно стандарту HTML, текст-содержимое гиперссылок форматируется особым образом, чтобы его всегда можно было отличить от остального текста. И по умолчанию все ссылки, еще не посещенные пользователем, выделяются синим цветом.

Рис. 3.40. Гиперссылка, указывающая на сайт Macromedia

Для создания гиперссылки из выделенного текста вы также можете воспользоваться пунктом Make Link меню Modify или контекстного меню или нажать комбинацию клавиш <Ctrl>+<L>. После этого на экране появится диалоговое окно Select File, показанное на рис. 3.41. Нужный адрес вводится в поле ввода URL этого окна. Остальные элементы управления лучше пока не трогать — мы рассмотрим их позже, когда будем связывать воедино все Web-страницы нашего сайта. Не забудьте нажать кнопку ОК, чтобы Dreamweaver создал эту гиперссылку.

Рис. 3.41. Диалоговое окно Select File

Просматривая рис. 3.39, вы, вероятно, обратили внимание, что справа от поля ввода интернет-адреса находятся две небольшие кнопки. Кнопка в виде мишени, находящаяся левее, нам пока бесполезна — мы рассмотрим ее, когда будем говорить об управлении сайтом, в главе 6. Кнопка в виде папки, находящаяся правее, позволит вам открыть то же самое диалоговое окно Select File.

Впоследствии вы можете изменить интернет-адрес вашей гиперссылки. Для этого поставьте текстовый курсор на текст гиперссылки, измените адрес и нажмите кнопку <Enter>. Вы также можете воспользоваться пунктом Change Link меню Modify или контекстного меню или нажмите комбинацию клавиш <Ctrl>+<L>. После этого на экране появится все то же незаменимое диалоговое окно Select File, в котором вы сможете изменить интернет-адрес.

Для удаления гиперссылки и превращения ее содержимого в обычный текст воспользуйтесь пунктом Remove Link меню Modify или контекстного меню или нажмите комбинацию клавиш <Ctrl>+<Shift>+<L>.

Отлично! Мы имеем гиперссылку для перехода на сайт Macromedia. Чего еще желать?

Много чего. Например, мы можем сделать так, что при переходе на сайт Macromedia пользователь будет иметь возможность просматривать также и сайт Иванова. Как это сделать? Очень просто: мы откроем сайт Macromedia в новом окне Web-обозревателя.

Поставьте текстовый курсор где-нибудь в тексте гиперссылки и снова посмотрите на редактор свойств. На рис. 3.42 показан раскрывающийся список задания цели гиперссылки.

Рис. 3.42. Раскрывающийся список задания цели гиперссылки, расположенный в редакторе свойств

Этот список содержит четыре пункта, но сейчас полезными для нас будут только два: _blank и _self. Первый из них позволит вывести страницу, на которую указывает гиперссылка, в новом окне Web-обозревателя, а второй — в том же окне. (Вместо того чтобы выбирать второй пункт списка, вы можете просто оставить его содержимое пустым.) В данном случае вам нужно выбрать пункт _blank.

Для задания цели гиперссылки вы также можете воспользоваться подменю Link Target меню Modify или подменю Target Frame контекстного меню. Для этого выберите нужный пункт-переключатель. Пункт Default Frame задает цель по умолчанию.

Примечание

Гиперссылка создается с помощью парного тега <А>, внутри которого помещается текст. Этот тег содержит обязательный атрибут HREF, задающий интернет-адрес назначения. Кроме того, данный тег может включать атрибут TARGET, задающий цель гиперссылки.

Вот мы и сделали первую нашу гиперссылку. Теперь примемся за вторую.


Назад    Содержание    Вперед