- •Методичні рекомендації до виконання практичної роботи №1 в цьому розділі розглянуті головні теги html коду. Описано структуру документу та можливості редагування тексту.
- •1.1. Основні поняття
- •1.2. Створюємо перший html-документ
- •1.3. Структура документу
- •1.3.1. Розділ head. Технічна інформація про документ
- •1.3.2. Розділ body. Основна частина документу
- •1.5. Форматування документу
- •1.4. Форматування окремих символів
- •1.4.1. Робота з текстом
- •1.4.2. Виведення тексту заданим шрифтом
- •1.5.5. Заголовки
- •1.5.6. Розподіл на абзаци
- •2.2.1. Вставляємо зображення в Web-сторінку
- •2.2.2. Використовуємо зображення як фон
- •2.3. Гіперпосилання
- •2.3.1. Зовнішні гіперпосилання
- •Абсолютна url-адреса
- •Відносна url-адреса
- •2.3.2. Внутрішні гіперпосилання
- •2.3.3. Гіперпосилання на адресу електронної пошти
- •Що містить абсолютна url-адреса?
2.3.1. Зовнішні гіперпосилання
Зовнішні гіперпосилання вставляються в HTML-документ з допомогою тега <A>.
Основним параметром тега <A> є href. Саме цей параметр задає URL-адресу Web-сторінки, яка буде завантажена при клацанні миші на покажчику. В якості покажчика може бути текст
<A href="http://bug.kpi.ua/3-kurs1/Текст посилання</A>
Після натискання
або зображення, якщо запис у http://bug.kpi.ua/3-kurs4
такий
<A href="http://bug.kpi.ua/3-kurs3/">Графічне посилання</A>
А індекс файл 3-kurs3 наступний
<IMG src="http://bug.kpi.ua/3-kurs3/internet.gif">
URL-адреса може бути абсолютною або відносною.
ДО УВАГИ СТУДЕНТІВ!!! Якщо ВАШ сайт працює під керуванням ЮНІКС системи, то файл, що запускається може бути тільки index.html, index.htm, index.php та інші розширення
Абсолютна url-адреса
Абсолютна URL-адреса містить позначення протоколу, доменну або IP-адресу комп'ютера, шлях до файлу, а також ім'я файлу. Наприклад:
http://bug.kpi.ua/folder/index.html
Якщо файл знаходиться в кореневій папці, то шлях може бути відсутнім.
http://bug.kpi.ua/index.html
Ім'я файлу також може бути відсутнім. В цьому випадку завантажується Web-сторінка, задана за замовчуванням в налаштуваннях Web-сервера .
Відносна url-адреса
При відносній URL-адресі шлях визначається з урахуванням місця розташування Web-сторінки, на якій знаходитися посилання. Можливі такі варіанти: Якщо потрібна Web-сторінка знаходиться в тій самій папці, то і Web-сторінка, що містить посилання, то URL-адреса може містити тільки ім'я файлу. Якщо з Web-сторінки, що знаходиться за адресою http://www.site.com.ua/folder1/folder2/file1.html, потрібно перейти на http://bug.kpi.ua/folder 1/ folder2/file 2.html, то посилання буде таким:
<A href="file2.html">Текст посилання</A>
Якщо з Web-сторінки, що знаходиться за адресою http://bug.kpi.ua/folder 1/folder2/file1.html потрібно перейти за адресою http://bug.kpi.ua/folder1/folder2/folder3/file2.html, то посилання буде таким:
<A href="folder3/file2.html">Текст посилання</A>
Якщо з Web-сторінки, що знаходиться за адресою http://bug.kpi.ua/folder1/folder2/file1.html потрібно перейти на http://bug.kpi.ua/folder1/folder2/file2.html, то посилання буде таким:
<A href="../file2.html">Текст посилання</A>
А з http://www.site.com.ua/folder1/folder2/folder3/file1.html на http://www.site.com.ua/folder1/file2.html:
<A href="../../file2.html">Текст посилання</A>
Дуже часто необхідно завантажити документ у нове вікно Web-браузера. Для цього в параметрі target тега <A> слід вказати значення _blank:
<A href="http://bug.kpi.ua/index.html" target="_blank">Посилання</A>
Інші значення параметра target ми розглянемо при вивченні фреймів.
2.3.2. Внутрішні гіперпосилання
За допомогою внутрішніх гіперпосилань можна створити посилання на різні розділи поточної Web-сторінки. Якщо документ дуже великий, то наявність внутрішніх гіперпосилань дозволить швидко переміщуватися між розділами.
Внутрішнє гіперпосилання також вставляється за допомогою тега < A > з однією відмінністю - параметр href містить ім'я покажчика, а не URL -адресу.<A href="#charter1">Глава 1</A>
Іноді покажчик називають «якорем». Покажчик створюється за допомогою тега <A>, але замість параметра href використовується параметр name, який задає ім'я покажчика.<A name="charter1"></A>
За допомогою цього посилання можна послатися на «якір» іншого документа.<A href= "http://bug.kpi.ua/index.html#charter6">Текст</A>
Структура документа з внутрішніми посиланнями приведена в лістингу 2.6.
