Вставка гиперссылок и графических изображений

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

Чтобы вставить гиперссылку, нужно выделить слово или текстовый фрагмент, который будет являться ссылкой, и нажать кнопку Ссылка на документ. В листинге 3.3 показан фрагмент программного кода, когда перед нажатием данной кнопки был выделено слово страница.

Листинг 3.3. Вставка гиперссылки

Учимся работать в программе HtmlPad

Итак, приступаем

Эта страница создана для примера

В сформированном коде остается лишь ввести вручную адрес гиперссылки, являющийся значением атрибута href.

Чтобы вставить в документ изображение, нужно нажать на данной вкладке кнопку Рисунок, предварительно поместив курсор в то место программного кода, где должна находиться картинка. При нажатии кнопки в программный код добавляется соответствующий фрагмент (листинг 3.4).

Листинг 3.4. Вставка изображения

Учимся работать в программе HtmlPad

Итак, приступаем

Эта страница создана для примера

В данном листинге остается лишь указать путь к файлу рисунка или просто имя этого рисунка (если он находится в том же каталоге, что и файл данной веб-страницы), а также задать при необходимости его дополнительные параметры. В листинге 3.5 представлен программный код, согласно которому на веб-странице будет отображаться рисунок с именем Образец.jpgразмером 150x150 пикселей, и заключенный в рамку толщиной 10 пикселей.

Листинг 3.5. Вставка изображения с заданными параметрами

Учимся работать в программе HtmlPad

Итак, приступаем

Эта страница создана для примера

Результат вставки изображения в соответствии с этим программным кодом представлен на рис. 4.23.

Рис. 4.24. Содержимое вкладки JavaScript

Принцип действия здесь примерно такой же, как и на остальных вкладках программы: после нажатия кнопки инструментальной панели в программный код веб-страницы добавляется соответствующий фрагмент, который при необходимости можно дополнить и конкретизировать. Вы можете вставлять следующие объекты JavaScript: код JavaScript, тело функции, название функции, текст и переменную. Например, после нажатия в инструментальной панели кнопки Вставка кода JavaScriptв программный код добавляется фрагмент , после нажатия кнопки Вставка текста– фрагмент document.write("");, после нажатия кнопки Вставка переменной– фрагмент document.write();, и т. д.

Если начинающие веб-разработчики занимаются созданием и администрированием сайтов преимущественно с помощью языка HTML, то их более «продвинутые» коллеги вовсю используют более сложный и функциональный язык – РНР.

Характерной особенностью языка РНР является то, что он был создан и разработан специально для написания web-приложений (сценариев), исполняющихся на удаленном веб-сервере. Несомненное преимущество РНР по сравнению с тем же JavaScript состоит в том, что скрипты, написанные на языке РНР, выполняются на стороне удаленного сервера. Следовательно, их работоспособность и скорость исполнения не зависит от скоростных характеристик и прочих аппаратных особенностей компьютера, а также от используемого Интернет-обозревателя. Отметим, что зачастую посетители сайтов не могут определить, что они видят на экране – статичный HTML-код или динамичную информацию, полученную в результате выполнения РНР-скрипта.

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

Первое, что нужно сделать, если вы намереваетесь интегрировать в программный код веб-страницы фрагмент PHP-кода – это нажать в инструментальной панели вкладки РНР кнопку Вставка куска кода РНР. В результате в программный код будет добавлен соответствующий фрагмент. В листинге 3.6 этот фрагмент находится после текстовой части контента.