Елементи HTMLДля парних тегів область впливу визначається частиною документа між відкриваючим і закриваючої тегом. Таку частину документа розглядають як елемент мови HTML. Так, можна говорити про «елемент BODY», що включає тег <BODY>, основний зміст документа і закриваючий тег </BODY>. Весь документ HTML можна розглядати як «елемент HTML». Для непарних тегів елемент збігається з тегом, що його визначає. Більшість елементів мови HTML описує частини змісту документа і міститься між тегами <BODY> і </BODY>, тобто, усередину структурного елемента BODY. Такі елементи поділяють на блокові і текстові. Блокові елементи відносяться до частин тексту рівня абзацу. Текстові елементи описують властивості окремих фраз і ще більш дрібних частин тексту. Тепер можна сформулювати правила вкладення елементів. • Елементи не повинні перетинатися. Іншими словами, якщо відкриваючий тег розташовується усередині елемента, те і відповідний закриваючий тег повинний розташовуватися усередині цього ж елемента. • Блокові елементи можуть містити вкладені блокові і текстові елементи. • Текстові елементи можуть містити вкладені текстові елементи. • Текстові елементи не можуть містити вкладені блокові елементи. Строго говорячи, усі правила мови HTML можна розглядати винятково як «побажання». Засіб, використовуваний для відображення Web-документа, зробить усе можливе, щоб витлумачити розмітку найбільш розумним образом. Проте, гарантію правильного відтворення документа дає тільки неухильне проходження вимогам специфікації мови. Функціональні блокові елементи У більшості документів основними функціональними елементами є заголовки й абзаци. Мова HTML підтримує шість рівнів заголовків. Вони задаються за допомогою парних тегів від <Н1 > до <Н6>. При відображенні Web-документа на екрані комп'ютера ці елементи показуються за допомогою шрифтів різного розміру. Звичайні абзаци задаються за допомогою парного тегу <Р>. Мова HTML не містить засобів для створення абзацного відступу («нового рядка»), тому при відображенні на екрані комп'ютера абзаци розділяються порожнім рядком. Закриваючий тег </Р> розглядається як необов'язковий. Мається на увазі, що він стоїть перед тегом, що задає початок чергового абзацу документа. Наприклад: <Н1> Заголовок </Н1> <Р> Перший абзац <Р> Другий абзац <Н2>Заголовок другого рівня</Н2> Наслідком наявності спеціального тегу, що визначає абзац, є той факт, що звичайного символу кінця рядка, що вводиться по натисканню клавіші ENTER, для створення абзацного відступу недостатньо. Мова HTML розглядає символи кінця рядка і пробіли особливим образом. Будь-яка послідовність, що складається тільки з пробілів і символів кінця рядка, при відображенні документа розглядається як одиночний пробіл. Це, зокрема, означає, що символ кінця рядка навіть не здійснює переходу на новий рядок (для цієї мети використовується текстовий елемент, що задається непарним тегом <BR>). Як обмежник абзаців може також використовуватися горизонтальна лінійка. Цей елемент задається непарним тегом <HR>. При відображенні документа на екрані лінійка розділяє частини тексту друг від друга. Її довжина і товщина задаються атрибутами тега <HR>. <HR ALIGN="RIGHT" SIZE="10" WIDTH="50%"> Цей тег створює горизонтальну лінійку шириною в 10 пикселів, яка займає половину ширини вікна і розташовану праворуч. Гіпертекстові посилання Гіпертекстове посилання є фрагментом тексту документа і потом. задаються текстовим елементом, обумовленим за допомогою парного тегу <А>. Цей елемент містить обов'язковий атрибут, що не може бути опущений. У даному випадку обов'язковим є атрибут HREF= (знак рівності показує, що необхідно задати значення цього атрибута). Як значення атрибута використовується адреса URL документа, на який указує посилання. Вона може вказувати на довільний документ, що розташовується на будь-якому загальнодоступному вузлі мережі (Web-вузол, архів FTP та інші). Наприклад, що відкриває тег посилання може мати вигляд <А HREF="http://www.site.com/index.htm">. Адреса URL може бути заданий в абсолютній формі, тобто починатися з вказання протоколу й адреси Web-вузла. Такий запис адреси використовується, коли необхідно направити відвідувача на інший Web-вузол, і розглядається як зовнішнє посилання При використанні відносної адреси в посиланні задається тільки відносний шлях пошуку для документа. У цьому випадку передбачається використання того ж протоколу і того ж Web-вузла, а посилання розглядається як внутрішнє. Внутрішнє посилання зберігає свою працездатність у випадку зміни адреси Web-вузла як цілого (наприклад, у результаті його переносу на інший сервер), тому при потенційній можливості такої події варто відмовлятися від повного завдання адрес у гіперпосиланнях. Гіперпосилання можна використовувати для посилання на мультимедійні файли. Це зручно, тому що в цьому випадку не приходиться чекати завантаження мультимедійних файлів при роботі з даною сторінкою. Якщо ж потрібне інтегрування об'єктів мультимедіа в Web-сторінку, використовують парний тег <OBJECT> або нестандартний непарний тег <EMBED>, що теж підтримується найбільш розповсюдженими броузерами. Повний формат гіперпосилання включає можливість посилання на певне місце на сторінці. Але це можна зробити для сторінок власної розробки, позначивши відповідне місце за допомогою якоря. Якір задається також за допомогою, парного тегу <А>, але в ролі обов'язкового виступає атрибут NAME=. Значення цього атрибута — довільна послідовність латинських букв і цифр (пробіли неприпустимі), розглянута як ім'я якоря. Для посилання на якір його ім'я вказується наприкінці адреси URL після символу «#». <А HREF="http://www site.com/index.htm#address"> Web-графіка Графічні ілюстрації в більшості випадків є невід'ємною частиною Web-документів. Сьогодні графічні елементи Web-сторінок використовують два основних формати — GIF та JPEG (новий формат PNG поки ще не можна вважати загальноприйнятим) Усі графічні броузери, призначені для відображення Web-сторінок на екрані комп'ютера, здатні розпізнавати і відображати файли цих форматів. Для підготовки зображень можна використовувати будь-як графічний редактор, наприклад стандартний додаток Paint (у Windows 98), що дозволяє зберігати файли в цих форматах. Файли формату GIF (Graphic Interchange Format) мають розширення.GIF. Зображення в цьому форматі містять 256 кольорів, заданих індексною палітрою. Файл упакований і може займати значно менше місця, ніж упакований растровий малюнок (наприклад, у форматі.BMP). Специфікація формату GIF89a дозволяє створювати файли.GIF, що володіють спеціальними можливостями. • Один із кольорів зображення може бути оголошений прозорим. Це означає, що у відповідних місцях крізь нього буде переглядати фон Web-сторінки, що дозволяє задати не тільки прямокутну форму малюнка, але і робить його більш природним. Черезстрочні зображення при їхньому прийомі з Інтернету прорисовуються поступово, спочатку грубо, а потім усе більш і більш чітко. Це «скрадає» час, необхідне на їхнє завантаження з Інтернету, особливо при прийомі інформації по повільних лініях. • GIF-анімація перетворює звичайний малюнок у невеликий відеоролик. У стандартному файлі з розширенням.GIF зберігається набір кадрів, а також сценарій їхнього відображення. Для створення файлів.GIF, що використовують ці розширені можливості, необхідний графічний редактор, більш могутній, ніж програма Paint. Для створення GIF-анімації використовують спеціальні засоби. Файли формату JPEG (Joint Photographic Expert Group — за назвою групи дослідників, що запропонувала цей формат, читається «джей-пег») можуть мати розширення JPEG або JPG. Формат призначений для збереження фотографічних зображень, що використовують 24-розрядний колір. При конвертуванні у формат JPEG відбувається втрата частини інформації, що приводить до деякого погіршення якості зображення, звичайно непомітному на око. При виборі формату зображення в першу чергу беруть до уваги обсяг файлу, що виходить, і в другу - якість зображення. При завантаженні Web-документа левину частку часу займає саме завантаження ілюстрацій, так що вітається будь-яка економія. При виборі формату рекомендується створити два файли: у форматі GIF чи у форматі JPEG з мінімально прийнятною якістю після чого вибрати варіант, що має менший обсяг. Малюнки зберігаються на Web-вузлах в окремих файлах, але відображаються як елементи Web-сторінок. Для вставки малюнка використовується текстовий елемент, який задається непарним тегом <IMG>. Тег <IMG> повинний містити обов'язковий атрибут SRC=, який задає адресу URL файлу з зображенням у відносній або абсолютній формі. <IMG SRC="picture1.gif">; При відображенні малюнка броузер за замовчуванням використовує його реальні розміри). Якщо малюнок необхідно відмасштабувати, застосовують атрибути WIDTH= і HEIGH=, які задають ширину і висоту малюнка (у пикселях), відповідно. Якщо ці параметри задані, то броузер може визначити, яке місце треба виділити для відображення малюнка, ще до того, як малюнок завантажений. Це трохи прискорює відображення сторінки, що завантажується, так що зручно задавати ці атрибути завжди. <IMG SRC="picture2.jpg" WIDTH="100" HEIGHT="40">; Зовнішній вигляд Web-сторінки залежить від того, як саме малюнок розташовується на ній. Тому що малюнок задається як текстовий елемент, що знаходиться усередині якогось абзацу, за замовчуванням він розглядається як убудоване зображення, що включається в рядок тексту. Щоб зображення відображалося автономно, його включають в окремий абзац. Для зображення, що дійсно включено в рядок, можна задати режим взаємодії з текстом за допомогою атрибута ALIGN=. <IMG SRC="picture3.gif" ALIGN="BOTTOM">) Цей атрибут може приймати три значення: • якщо задано ALIGN="BOTTOM", то нижня границя зображення сполучається з підставою текстового рядка; • якщо задано ALIGN="MIDDLE", те середина зображення сполучається із серединою текстового рядка; • якщо задано ALIGN="TOP", те верхня границя зображення вирівнюється по верхньому обрізу текстового рядка. Однак більш краще використання «зображення, що плаває», обтічним текстом, що також досягається використанням атрибута ALIGN=: • якщо задано ALIGN="LEFT", то зображення розміщається в лівого краю сторінки, а наступний текст розміщається праворуч від нього; • якщо задано ALIGN="RIGHT", то зображення розміщається у правого краю сторінки, а наступний текст розміщається ліворуч від нього. У цьому випадку рекомендується поміщати тег <IMG> у самий початок відповідного абзацу. Однак нормальний режим обтікання вимагає, щоб між текстом і зображенням залишався деякий проміжок. Задати величину цього проміжку можна за допомогою атрибутів HSPACE= (по горизонталі) і VSPACE = (по вертикалі). Розміри задаються в пикселях. Створюючи ілюстровані сторінки, не слід забувати, що не усі зможуть побачити ці ілюстрації. Читачів, що не мають адекватного засобу перегляду, можна ознайомити зі змістом ілюстрацій за допомогою альтернативного тексту. Альтернативний текст задається як значення атрибута ALT= і відображається замість картинки, якщо вона з якихось причин не може бути виведена. Тому що зображення задається як текстовий елемент, воно може бути поміщене усередину іншого текстового елемента, наприклад, що задає гіперпосилання (тег <А>). У цьому випадку зображення стає зображенням-посиланням. При відображенні документа на екрані комп'ютера таке зображення відрізняється синьою рамкою і зміною форми покажчика при наведенні. Ще один спосіб застосування зображень на Web-сторінках складається у використанні їх як фоновий малюнок. При відображенні документа, що містить фоновий малюнок, на комп'ютері робоча область вікна заповнюється цим малюнком послідовно (як паркетом), вважаючи від верхнього лівого кута документа або вікна. Фоновий малюнок задається за допомогою атрибута BACKGROUND= у тегі < BODY >. Значенням цього атрибута повинна бути абсолютна або відносна адреса URL для файлу з зображенням. <BODY BACKGROUND="waves.gif” TEXT="YELLOW">
|
