Категории
Меню
Лучшие книги » Компьютеры и Интернет » Интернет » Веб-Самоделкин. Как самому создать сайт быстро и профессионально - Алексей Гладкий

Веб-Самоделкин. Как самому создать сайт быстро и профессионально - Алексей Гладкий

Читать онлайн Веб-Самоделкин. Как самому создать сайт быстро и профессионально - Алексей Гладкий

Шрифт:

-
+

Интервал:

-
+

Закладка:

Сделать
1 ... 39 40 41 42 43 44 45 46 47 ... 50
Перейти на страницу:

Листинг 5.7. Вставка графического объекта с указанием его размеров, толщины рамки, альтернативного текста

<html>

<head><title>Сведения о компании</title></head>

<body>

<h1>Добро пожаловать</h1>

<b>Наша компания была создана в 2005 году.</b><br>

<img src="Образец.jpg" width="320" height="240" border=10 alt="Извините, изображение не может быть показано"><br>

За прошедшее время мы сумели занять лидирующие позиции на рынке и завоевать немало постоянных клиентов.<br>

Наша прибыль постоянно растет, и мы задумываемся о расширении.<br>

<i>Будем рады видеть вас в числе наших клиентов!</i><br>

</body>

</html>

Теперь сохраним выполненные изменения с помощью команды главного меню Файл ► Сохранить или нажатием в инструментальной панели кнопки Сохранить изменения, и перейдем на вкладку Просмотр. Результат выполненных действий показан на рис. 6.9.

Рис. 6.9. Вставка графического объекта

Теперь просмотрим, как отображается альтернативный текст. Для этого отключим в Интернет-обозревателе, используемом на данном компьютере, режим показа графических объектов, и откроем нашу страницу в этом обозревателе. Результат выполненных действий показан на рис. 6.10.

Рис. 6.10. Отображение альтернативного текста

Как видно на рисунке, в данном случае вместо графического отображения показан альтернативный текст, который мы ранее определили в исходном коде страницы (см. листинг 5.7). А вот рамка отображения толщиной 10 пикселей осталась на месте, поскольку мы отключили в Интернет-обозревателе отображение только графических объектов (управление отображением рамок, обрамляющих графические объекты, осуществляется отдельно).

Вставка гиперссылок на внутренние и внешние ресурсы

Здесь мы расскажем о том, как средствами программы Extra Hide Studio можно формировать на веб-странице ссылки на внутренние и внешние ресурсы (под внутренними ресурсами в данном случае подразумеваются другие страницы этого же сайта, а под внешними – любые сторонние сайты).

По аналогии с графическими объектами, гиперссылки можно вставлять тремя способами: путем ввода соответствующего фрагмента исходного кода вручную, путем использования кнопки Ссылку на вкладке Вставка, а также с помощью специально предназначенного Мастера ссылок, который позволяет полностью автоматизировать процесс вставки гиперссылки в веб-документ. Отметим, что для вставки тегов и атрибутов гиперссылки можно воспользоваться также панелью Быстрый ввод, которая расположена в правой части интерфейса программы, но по сути это будет то же самое, что и использование кнопки Ссылку.

При нажатии кнопки Ссылку в исходный код страницы (а именно – в то место, где находится курсор) будет вставлен следующий фрагмент: <a href="« class=»" title=""></a>. Очевидно, что его необходимо дополнить, как минимум – вставить адрес гиперссылки, которым может являться как имя файла другой веб-страницы этого же сайта, так и веб-адрес любого другого ресурса. Напомним, что адрес гиперссылки является значением атрибута href.

Начинающим веб-разработчикам для вставки гиперссылок рекомендуется использовать Мастер ссылок. Для перехода в данный режим следует выполнить команду главного меню Утилиты ► Мастер ссылок или нажать в инструментальной панели, расположенной слева внизу окна, кнопку Мастер вставки ссылки. В любом случае на экране отобразится окно, которое показано на рис. 6.11.

Рис. 6.11. Мастер вставки ссылки

В данном окне осуществляется настройка параметров гиперссылки. Отметим, что перед вызовом данного окна следует поместить курсор в то место исходного кода веб-страницы, в которое должна быть вставлена гиперссылка.

В поле Название с клавиатуры следует ввести название гиперссылки. Иначе говоря, здесь вводится текст, который на веб-странице будет являться гиперссылкой.

В поле Адрес указывается адрес гиперссылки. Если вы хотите сослаться на другую веб-страницу этого же ресурса – в данном поле нужно ввести имя файла данной страницы (например, Test.html). Если же вам нужно создать ссылку на внешний ресурс, то вводите ее в таком формате, как показано на рис. 6.11. Иначе говоря, при создании ссылки на портал www.yandex.ru нужно вводить адрес так: http://www.yandex.ru.

В поле Описание при необходимости можно указать текст всплывающей подсказки, которая будет отображаться при подведении указателя мыши к ссылке на веб-странице. Отметим, что данный параметр не является обязательным для заполнения: он нужен лишь тогда, когда гиперссылка требует дополнительных пояснений.

В поле Открывать как из раскрывающегося списка выбирается способ открытия гиперссылки. Возможен выбор одного из трех вариантов – По умолчанию, В новом окне или На все окно.

Завершается процесс формирования и вставки гиперссылки нажатием в данном окне кнопки Добавить. С помощью кнопки Отмена осуществляется выход из данного режима без вставки гиперссылки.

В листинге 5.8 представлен исходный код созданной нами ране веб-страницы, в которую вставлена гиперссылка в соответствии с настройками, представленными на рис. 6.12. В данном случае ссылкой являются слова лидирующие позиции.

Листинг 5.8. Вставка гиперссылки на внешний ресурс

<html>

<head><title>Сведения о компании</title></head>

<body>

<h1>Добро пожаловать</h1>

<b>Наша компания была создана в 2005 году.</b><br>

<img src="Образец.jpg" width="320" height="240" border=10 alt="Извините, изображение не может быть показано"><br>

За прошедшее время мы сумели занять <a href="http://www.yandex.ru" target="_blank" title="Подробности">лидирующие позиции</a> на рынке и завоевать немало постоянных клиентов.<br>

Наша прибыль постоянно растет, и мы задумываемся о расширении.<br>

<i>Будем рады видеть вас в числе наших клиентов!</i><br>

</body>

</html>

После сохранения внесенных изменений наша страница в окне Интернет-обозревателя будет выглядеть так, как показано на рис. 6.12.

Рис. 6.12. Страница с гиперссылкой

Как видно на рисунке, гиперссылкой в данном случае является словосочетание лидирующие позиции, и эта ссылка ведет на портал www.yandex.ru (информация об этом отображается в строке состояния Интернет-обозревателя). Если подвести указатель мыши к гиперссылке, то отобразится всплывающая подсказка со словом Подробности.

Представление данных в табличном виде

Как мы уже неоднократно отмечали ранее, представление данных в табличном виде имеет немало преимуществ: наглядность, компактность, эргономичность, хорошая восприимчивость информации, и др. В данном разделе мы рассмотрим, как осуществляется формирование и вставка таблиц в веб-документ средствами программы Extra Hide Studio.

Здесь мы продолжим работу с той же веб-страницей, на примере которой работали и ранее. Таблицу, состоящую из трех строк и четырех столбцов, мы поместим между двумя последними фразами текстовой части контента.

Для построения таблиц в программе предназначены инструменты, которые находятся на вкладке Таблицы. Содержимое данной вкладки показано на рис. 6.13.

Рис. 6.13. Инструменты, предназначенные для формирования и вставки таблиц

Как видно на рисунке, данная вкладка содержит четыре кнопки. С помощью кнопки Таблица в исходный код текущей страницы вставляется фрагмент, позволяющий идентифицировать таблицу и задать ее основные параметры: <table border="« cellpadding=»" cellspacing="« bordercolor=»" bgcolor=""></table>. Теги <table> </table> идентифицируют таблицу, а с помощью атрибутов можно задать толщину рамки таблицы, расстояние от содержимого ячеек до их границ, а также цветовое оформление таблицы.

Кнопки Строка и Столбец предназначены для добавления в таблицу соответственно строк и столбцов. С помощью этих кнопок в исходный код вставляются теги <tr> </tr> и <td> </td>.

Однако формирование таблиц с помощью кнопок Таблица, Строка и Столбец – это, можно сказать, наполовину ручной способ, поскольку многие параметры придется задавать вручную. Намного удобнее воспользоваться режимом автоматического формирования таблиц, который вызывается с помощью кнопки Мастер или команды главного меню Утилиты ► Мастер создания таблиц. Окно Мастера, которое отображается на экране при активизации данной команды, представлено на рис. 6.14.

1 ... 39 40 41 42 43 44 45 46 47 ... 50
Перейти на страницу:
Пожаловаться на ошибку
Похожие материалы
Как раскрутить и разрекламировать Web-сайт в сети Интернет - Александр Загуменов Библиотека книг бесплатно – читать онлайн! | BibliotekaOnline.com
Как раскрутить и разрекламировать Web-сайт в сети Интернет - Александр Загуменов
27.12.2023 - 21:25
Профессиональный поиск в Интернете - Алексей Кутовенко Библиотека книг бесплатно – читать онлайн! | BibliotekaOnline.com
Профессиональный поиск в Интернете - Алексей Кутовенко
18.04.2024 - 01:01
Комментарии

Copyright @ bibliotekaonline.com 2024 - 2025. Все права защищены.


Почта для связи: [email protected]