Главная » Файлы » Для учня/студента » Інформатика [ Добавить материал ]
Hyper Text Markup Language - мова розмічання гіпертексту Реферат
[ · Скачать удаленно (116 Kb) ] 19.07.2010, 22:00
Hyper Text Markup Language - мова розмічання гіпертексту
Стандарт HTML 3.2 є специфікацією мови розмічання гипертексту, запропонованою організацією W3C і розробленою на початку 1996 року в кооперації з такими фірмами, як IBM, Microsoft, Netscape Communication Corporation, Novell, SoftQuad, Spyglass, і Sun Microsystems. W3C спільно із згаданими фірмами продовжує роботу над розширенням можливостей елементів мови HTML, таких як feagures, об'єкти мультимедіа, скріпти, типи стилів, розмітка (layout), форми, математичні символи, і над інтенаціоналізацією мови. W3C планує включити результати цієї роботи у наступні версії мови HTML.
Мова HTML 3.2 є реалізацією SGML - стандартної узагальненої мови розмітки (Standard Generalized Markup Language), що відповідає вимогам міжнародного стандарту ISO 8879. Тому синтаксис документа HTML 3.2 визначається комбінацією декларацій SGML і визначень для типів документів (DTD).
Документ HTML можна розглядати як сукупність команд і даних (як безпосередньо розміщених у документі, так і пов’язаних з ним посиланнями), які при інтерпретації програмою-броузером відтворюють вигляд сторінок документу. Отже, у відповідності до прийнятих у інформатиці визначень, HTML-документ можна вважати програмою, описаною мовою високого рівня. Вказівки, до складу яких входять дескриптори і атрибути, називаються тегами. Дескрипторами називатимемо частини тегів, які вказують на спосіб відтворення образу. Дескриптори вказують на способи відтворення інформації програмам-броузерам, які утворюють середовище-інтерпретатор. Атрибути деталізують описання способів відтворення, тобто їх значення є операндами. Оскільки стандартом SGML допускаються атрибути, які не потребують операндів, тобто визначають і спосіб виведення, так і його параметри і є за прийнятим визначенням одномістною командою, то іноді дескриптор, атрибут і його значення описується одним кодом (наприклад, тег

- абзац).
При повному встановленні пакету Microsoft Office його додатки можуть пропонувати користувачеві збереження документа у вигляді HTML. Слід зазначити, що документ HTML можна створити і під ДОС, використовуючи будь-який текстовий редактор.
Цей формат використовується з метою забезпечення перенесення документів на комп’ютери, на які не встановлено пакет Microsoft Office, а тільки броузер, забезпечення доступу до документу з мережі. Зараз найбільш поширеними броузерами є Internet Explorer та Netscape Navigator, але у спеціальних випадках використовуються і інші, зокрема чисто текстові броузери, які не працюють з графікою і мультимедіа.

Структура HTML-документу
Документ HTML складається із вказівок - тегів, обмежених символами "<" та ">", які можуть утворювати контейнери (частину документу, обмежену операторними дужками, аналогічно до "begin … end" мови Pascal, причому закриваючий тег починається з "<\"), або розташовуватись окремо. Контейнер іноді називають “елементом HTML документу”. Теги вигляду не інтерпретуються і не виконуються, а трактуються як коментарі, аналогічно до рядків, що починаються із вказівки "REM" у програмах мовою Basic та командних файлах дискової операційної системи або записів вигляду {Ми це не виконуємо і навіть не читаємо} у програмах мовою Pascal.
Кожний документ починається із декларативної частини - заголовка, і тіла документа. Документи мовою HTML 3.2 починаються з декларації , після цього слідує контейнер тегів, який розпочинається з вказівки " " і закінчується "":



Вивчення динаміки популяцій
... Інші елементи заголовку


... Тіло документа

У модулі "" має бути розташований контейнер "… <\TITLE> ", який містить назву документу, яка виводиться на екран. Якщо у документі даний тег відсутній, то на місці заголовку буде розташовано URL-адресу файлу. <br /> <HTML> <br /> <HEAD> <br /> <TITLE> Це заголовок


Власне документ HTML -тіло документу

Форматування тексту засобами HTML
При виведенні тексту на екран монітора броузери ігнорують форматування, яке виконується при створенні тексту у текстовому редакторі, тобто, ігноруються невідтворювані символи переведення рядка, абзацу, іноді навіть ігноруються порожні (без тексту) рядки.
Форматування тексту мовою HTML виконується використання спеціальних тегів і передбачає створення заголовків, абзаців, вирівнювання тексту, виділення тексту напівжирним шрифтом, курсивом, підкресленням, зміну розміру шрифта.
В HTML існує шість рівнів заголовків і кожному з них відповідає свій розмір шрифта. З допомогою заголовків різних рівнів можна створювати чітку ієрархічну структуру документа. Заголовку 1 рівня відповідає найбільший розмір шрифта. Синтаксис HTML-коду, що створює заголовки різного рівня має вигляд:

Заголовок першого рівня


Заголовок другого рівня


… … …. … … …
Заголовок шостого рівня

Для кращого сприйняття сторінки користувачем, не слід пропускати рівні заголовків.
Для відображення тексту в HTML немає спеціального дескриптора. Текст вводиться в будь-якому місці між тегами . Текст автоматично розміщується за шириною вікна броузера. Якщо ж необхідно на Web-сторінці помістити порожній рядок або забезпечити в потрібному місці перехід до наступного рядка, слід використовувати спеціальні теги: тег розриву абзацу

, та розриву рядка
. Тег розриву абзацу дає команду броузеру закінчити поточний абзац і помістити порожній рядок перед наступним абзацом. Тег розриву рядка вказує про закінчення поточного рядка і переходу до наступного. Відмітимо, що для тегу розриву абзацу використання закриваючого тегу

не є необхідним. Наприклад:

Використання тегів розриву рядка та абзацу Тег розриву абзацу вказує броузеру вставити порожній рядок перед початком наступного абзацу.

Тег розриву рядка вказує броузеру
перейти на наступний рядок.

Текст абзацу, чи заголовка може бути вирівняно за лівим краєм, за правим краєм, або за центром вікна броузера. Для вирівнювання тексту використовується параметр ALIGN=вирівнювання, де атрибут “вирівнювання” може приймати значення: LEFT для вирівнювання за лівим краєм, RIGHT для вирівнювання за правим краєм, CENTER для вирівнювання за центром. Найчастіше параметр ALIGN використовується у тегах розриву абзацу та задання заголовку. Наприклад:


Приклад вирівнювання тексту


Розміщення заголовку тексту по центру



Вивчення HTML невдовзі стане такою ж необхідністю, як вміння ввімкнути комп’ютер, скопіювати файл чи скористатися текстовим редактором. Якщо користувач вміє набирати текст, то зможе освоїти і використання HTML.


Мова HTML надає можливість виділяти фрагменти тексту напівжирним шрифтом, курсивом, підкресленням тощо. Для цього в HTML існують спеціальні дескриптори, які називають дескрипторами стилів. Всі дескриптори стилів є контейнерами. Основні дескриптори стилів подано в таблиці 1.
Таблиця 1
Дескриптор Стиль Приклад
Напівжирний шрифт Напівжирний
Курсив Курсив
Підкреслення Підкреслений текст
Підрядковий текст Текст підрядковий текст
Надрядковий текст Текст надрядковий текст
Перекреслення Перекреслений

Використання дескрипторів стилів розглянуто у наступному прикладі:


Приклади виділення тексту тегами стилів


Приклад виділення тексту напівжирним шрифтом.


Можна також виділити текст курсивом.


Особливо важливі місця можна підкреслити.


Можна створити надрядковий або
підрядковий текст.


Крім того, текст можна перекреслити.


Розмір шрифта можна визначити з допомогою дескриптора :

Атрибут SIZE дозволяє вказувати абсолютний ( значення від 1 до 7) та відносний (значення від –4 до +4) розміри шрифта по відношенню до розміру основного шрифта, тобто шрифта, що використовується в основній частині сторінки. Для зміни розміру основного шрифта використовується елемент . Значення атрибуту SIZE може бути число від 1 до 7. Для броузера стандартним є розмір шрифта 3. Відмітимо, що дескриптор може використовуватись тільки як складений тег, оскільки вимагає параметрів.
З метою форматування може використовуватись нероздільний пропуск –  . Використання цього символа в коді HTML-файлу забезпечує появу на Web-сторінці одного пропуску. Наприклад, при виведенні тексту "розмір     шрифту" броузер між словами “розмір” і “шрифту” помістить 5 пропусків.

Використання гіперпосилань
Гіперпосилання – це описання вказівки броузеру звернутись до даних або вказівок у межах (або за межами) HTML-документу. Власне гіперпосилання - це і є те, задля чого створюється гіпертекст. За допомогою гіперпосилань користувачі можуть переходити з однієї сторінки до іншої. Саме завдяки їх використанню документ стає інтерактивним і динамічним.
Існують три основних типи гіперпосилань: внутрішні, зовнішні і відносні.
Внутрішні гіперпосилання (internal links )– це посилання на об’єкти в межах одного документу. З їх допомогою користувач може переміщатись всередині однієї Web-сторінки. Такі посилання доцільно використовувати на довгих сторінках, щоб мати можливість швидко переміщатись між їх розділами.
Зовнішні гіперпосилання (external links) – це посилання на сторінки, розміщені на іншому Web-сервері.
Відносні (relative links), або локальні (local links) посилання – це посилання на Web-сторінки, розміщені на тому ж сервері. Адреси цих посилань задаються відносно адреси Web-сторінки, на якій вони поміщені.
Для зовнішніх гіперпосилань використовується синтаксис: текст посилання , де URL - повна адреса документа, на який здійснюється посилання. Текст поміщений у контейнер зображається в броузері з підкресленням та виділяється кольором (найчастіше синім). Перемістивши на посилання курсор і натиснувши ліву клавішу мишки, даємо вказівку броузеру завантажити сторінку, яка розміщена за адресою URL.
Наприклад:
Комп’ютери компанії IBM
- є гіперпосиланням на Web-сторінку, розміщену за адресою http://www.ibm.com/сomputers.html.
Зв’язуючи сторінки одного сервера гіперпосиланнями, немає необхідності включати до URL доменне ім’я. Наприклад:
Комп’ютери виробництва IBM - створюється гіперпосилання на файл computers.htm, який повинен знаходитись на тому ж самому сервері і в тому ж підкаталозі, що і файл, в якому знаходиться це гіперпосилання.
Якщо файл знаходиться у іншому піддиректорії, то необхідно вказати шлях до нього, наприклад:
Комп’ютери виробництва IBM
Є й інші можливості для спрощення записів довгих адрес URL. Так, наприклад, HTML-код


Основні розділи Web-сайту НПУ ім. М.П.Драгоманова


Абітурієнту
Аспірантура
Факультети
Ректорат


можна записати компактніше:


Основні розділи Web-сайту НПУ ім. Драгоманова



Абітурієнту
Аспірантура
Факультети
Ректорат


Тут використовується дескриптор "BASE" у складі тегу , у якому вказано базу адреси URL, відносно якої подаються всі інші відносні адреси Web-сторінок. Зазначимо, що цей тег використовується всередині контейнера … і його областю дії є вся сторінка.
Створюючи великі Web-сторінки, необхідно також забезпечити можливість для користувача легко переміщуватись з одного їх розділу до іншого. Це досягається завдяки внутрішнім гіперпосиланням. Для реалізації такого посилання необхідні два елементи: посилання, яке вказує куди треба перейти, і мітка, яка визначає місце переходу.
Посилання до мітки описується кодом:
Текст посилання
Мітка також використовує контейнер і описується так: текст
Назва мітки – це довільний текст, який не виводиться на екран броузером і позначає місце переходу. Якщо на сторінці є кілька міток, то всі вони повинні мати різні назви. Символ “#” при описанні посилання вказує, що після нього записано назву мітки, а не назву файла.
Для кращого розумінні роботи внутрішніх гіперпосилань доцільно створити та протестувати у броузері Web-сторінку з таким кодом:


Колекція програм мовою VisualBasic

До вашої уваги пропонується колекція програм мовою VisualBasic:


Побудова графіків функцій

Упорядковування масиву

Розв’язування квадратних рівнянь



Побудова графіків функцій – приклад програми

(текст програми)


Упорядкування масиву – приклад програми

(текст програми)



Розв’язування квадратних рівнянь – приклад програми

(текст програми)


Можна зробити так, щоб після активізації певного посилання звучала музика, або програвався відеофільм. Посилання на мультимедійні файли *.avi, *.wav створюються так само, як посилання на HTML-документи. В атрибуті HREF контейнера необхідно вказати ім’я файла, в якому міститься потрібна мелодія або відеофільм. Наприклад:

Натиснітьтут, щоб почути улюблену композицію


Файл my_music.wav повинен знаходитись на тому ж сервері і у тому ж директорії, що і HTML-файл, із якого він викликається. Для створення гіперпосилань на файли мультимедія, розміщені на інших серверах Internet, використовуються повні URL-адреси.
Часто виникає необхідність включити до Web-сторінки посилання на адресу електронної пошти. Для цього в атрибуті HREF необхідно задати адресу електронної пошти у вигляді “mailto: адреса”. Наприклад, щоб створити посилання на адресу kito@npu.kiev.ua, необхідно у код сторінки помістити такий контейнер: kito@npu.kiev.ua, згідно якого броузер відображає текст “kito@npu.kiev.ua” як гіперпосилання. Якщо клацнути на ньому мишкою, броузер відкриє поштову програму в режимі створення листа, і в полі “Aдреса:” помістить адресу kito@npu.kiev.ua. Текст, що розміщується у контейнері <А>, може бути будь-яким, проте доцільно використовувати адресу E-mail, оскільки не всі користувачі сторінки можуть користуватись поштовими програмами, що встановлені на комп’ютері, з якого переглядається сторінка.
Цей спосіб можна використати для створення власного списку адресатів, яким найчастіше посилаються повідомлення. Список у формі меню викликатиметься при зверненні до HTML-документу, вміст якого наведено нижче.


Електронні адреси



Електронні адреси





Для створення листа викличте відповідне посилання



kito@npu.kiev.ua    НПУ імені М.П.Драгоманова

cic@cic.univer.cherkasy.ua    Черкаський державний університет

ashat@ashat.mephi.msk.su    MediaPublishing-МИФИ




Можливі і інші використання HTML документів, зокрема для полегшення роботи з програмними засобами, які часто використовуються, можна створити HTML – документ, який буде спеціалізованим меню для запуску програмних засобів певного призначення і ярлик його розмістити на Робочому столі. Таким чином досягатиметься економія місця на робочому столі і певна організованість роботи з програмними засобами.

Програми для роботи з растровим зображенням


Для роботи із растровою графікою викличте відповідний редактор


Редактор для роботи з фотографіями


Перегляд фото


Спеціалізований редактор


Редактор для зображень у застарілих форматах

Списки
У HTML – документах можна використовувати списки, які полегшують сприйняття тексту. Списки можуть бути трьох типів:
• ненумеровані (з маркером позиції);
• послідовно нумеровані;
• списки словникового типу або списки визначень.
Фрагмент коду для створення ненумерованого списку:

  • Перший елемент списку

  • Перший елемент списку

  • Другий елемент списку

  • Третій елемент списку

Маркери списку можуть мати вигляд за замовчуванням (заповнені кружечки) або один з двох інших: квадратики (SQUARE) або порожні кружечки (СIRCLE). Тип маркера вказується у відкриваючому тезі контейнера списку: .
Фрагмент коду для створення нумерованого списку:

  1. Перший елемент списку

  2. Другий елемент списку

  3. Третій елемент списку


Спосіб нумерування елементів списку вказується атрибутом тегу.
Тег з атрибутом Значення
    Нумерування арабськими цифрами (значення за замовчуванням)
    < OL TYPE = “а”> Рядкові літери
    < OL TYPE = “А”> Великі літери
    < OL TYPE = “і”> Нумерування римськими літерами (маленькими)
    < OL TYPE = “І”> Нумерування римськими літерами (великими)
    При потребі можна вказати початковий номер елементу атрибутом START, наприклад:
      . Нумерований список, початковий елемент якого позначено латинською літерою “Е”, описано фрагментом:

      1. Перший елемент списку

      2. Другий елемент списку

      3. Третій елемент списку

      4. Четвертий елемент списку

      .
      Досить зручний вигляд має список словникового типу, який формується з використанням тегу
      . Тег терміна
      , як правило, використовується першим, а тег визначення
      - другим. Наприклад:

      Теги списків


      Тег UL

      Створює ненумерований список (список із маркерами)

      Тег ОL

      Створює нумерований список

      Тег LІ

      Використовується у списках для обмеження їх елементів

      Тег DL

      Створює список словникового типу

      Тег DT

      Визначає термін у спискові словникового типу

      Тег DD

      Визначає визначення терміну у спискові словникового типу

      Допускається довільне вкладення списків, наприклад, одним з пунктів нумерованого списку може бути ненумерований список, або ненумерований список може містити ненумерований список з іншими маркерами.

      Таблиці у HTML – документах.
      Подання інформації у таблицях подібне за зовнішнім виглядом до таблиць у текстовому редакторі Word, у електронних таблицях Excel, але використання їх набагато ширше, оскільки у формі таблиць можуть бути сформовані різні інтерактивні засоби, зокрема WEB-сторінки.
      Описання таблиці починається з тегу

      . Параметри таблиці описуються за допомогою тегів: - для описання рядків,
      - для заголовка таблиці,
      - для описання даних (тобто вмісту комірок). Заголовки у таблиці можуть не тільки розміщуватись як назви стовпчиків, а і як назви рядків.
      Приклад коду таблиці.

      Фірма “Зодіак”


      Прибутки і видатки за 2000 рік (дійсні і очікувані)







      Перший квартал Другий квартал Третій квартал Четвертий квартал
      Прибутки 12 % (дійсні) Прибутки 10 % (дійсні) Збитки 5 % (дійсні) Прибутки 10 % (передбачувані) Збитки 5 % (передбачувані)

      Вирівнювання даних у комірках таблиці описується атрибутом ALIGN тегів з дескрипторами TH i TD. Атрибут може набувати значень LEFT, RIGHT, CENTER для вирівнювання по лівій межі, правій межі або за центром, наприклад       		вказує на вирівнювання за лівою межею.
      У цих же тегах можуть розміщуватись атрибути COLSPAN i ROWSPAN, за допомогою яких будується складна таблиця. Наприклад, тег       		вказує на те, що відповідна комірка має висоту утричі більшу, ніж висота рядка, а тег - що комірка має ширину, утричі більшу за ширину стовпчика.

      Графіка у HTML – документах.

      Завдання для практичного виконання
      1. У Web-редакторі створити сторінки, розглянуті у вищенаведених прикладах.
      2. Заповнити дидактичну картку і створити сторінку з її зображенням, :
      При створенні сторінки використати: дескриптори стилів, розриву рядка, абзацу, атрибути вирівнювання, символи нероздільного пропуску ( ).

      Завдання на створення наборів сторінок, з’єднаних гіперпосиланнями.
      Створити набір сторінок для перевірки знань з основ молекулярно-кінетичної теорії, використовуючи посилання на сторінки, виконані у вигляді окремих файлів, причому для .
      1. Що слід розуміти під термодинамічним процесом?
      2. Що називають газовим законом?
      3. Що показує температура?
      4. Що характеризує температура?
      5. Що таке температура?
      6. Який процес називають: 1) ізобарним; 2) ізохорним; 3) ізотермічним; 4) адіабатним?
      7. Який газ приймають за ідеальний?
      Далі учні самостійно зі списку наведеного нижче вибирають правильну відповідь і кілька неправильних.
      1. Міра середньої кінетичної енергії хаотичного руху молекул.
      2. Стан теплової рівноваги.
      3. Кількісна залежність між двома параметрами стану при сталому третьому.
      4. Зміна параметрів стану системи.
      5. Коли розмірами молекули і силами притягання між ними нехтують.
      6. Якщо змінюються параметри стану системи без теплообміну з навколишнім середовищем.
      7. Ступінь відхилення теплового стану системи від стану, прийнятого за нульовий.
      8. Зміна об’єму і температури при незмінному тиску.
      9. Зміна температури і тиску при незмінному об’ємі.
      10. Зміна тиску і об’єму при незмінній температурі.

      Кореневу сторінку створити у вигляді:
      Дайте відповідь на запитання
      Що характеризує температура?
      1. Стан теплової рівноваги.
      2. Міра середньої кінетичної енергії хаотичного руху молекул.
      3. Ступінь відхилення теплового стану системи від стану, прийнятого за нульовий.
      4. Зміна параметрів стану системи.
      При клацанні клавішею мишки на одній з відповідей, броузер повинен завантажити сторінку, яка б повідомляла користувача чи правильно він відповів на запитання та давала можливість з допомогою гіперпосилання повернутись на кореневу сторінку.

      Категория: Інформатика | Добавил: referatwm
      Просмотров: 321 | Загрузок: 63 | Рейтинг: 0.0/0