- •Конспект лекцій з дисципліни
- •Лекція 1. Принципи організації глобальної мережі Інтернет. Введення в Веб-технології: структура та принципи Веб.
- •Предмет курсу
- •Характеристика Інтернет
- •Стек протоколів tcp / ip
- •Система доменних імен dns
- •Структура і принципи www
- •Проксі-сервери
- •Протоколи Інтернет прикладного рівня
- •Лекція 2. Принципи побудови Веб-сайтів. Структура Веб застосуваннь. Характеристика мови html.
- •Історія розвитку html
- •Принципи гіпертекстової розмітки
- •Групи тегів нтмl
- •Лекція 3. Структура html-документа і елементи розмітки заголовка документа.
- •Призначення заголовка
- •Відображення змісту елемента title
- •Основні контейнери заголовка
- •Елемент розмітки head
- •Елемент розмітки title
- •Елемент розмітки base
- •Елемент розмітки meta
- •Елемент розмітки link
- •Елемент розмітки style
- •Елемент розмітки script
- •Лекція 4. Контейнери тіла документа.
- •Теги тіла документа
- •Тіло документа - контейнер body
- •Теги управління розміткою Заголовки
- •Атрибут аlign
- •Теги управління відображенням символів
- •Теги, що управляють формою відображення
- •Верхні і нижні індекси
- •Атрибут sizе
- •Атрибут соlоr
- •Створення списків в html
- •Атрибути маркерів у ненумерований списку
- •Коментарі в мові html
- •Гіпертекстові посилання
- •Лекція 5. Графіка.
- •Використання графіки в html.
- •Атрибут src
- •Атрибут alt
- •Атрибут аlign
- •Формати графічних файлів
- •Активні зображення
- •Зображення в мініатюрі
- •Лекція 6. Таблиці html.
- •Засоби опису таблиць в html
- •Створення таблиць в html
- •Атрибут nowrap
- •Атрибут соlspan
- •Атрибут rowspan
- •Атрибут widтн
- •Застосування порожніх клітинок
- •Атрибут сеllраdding
- •Атрибути аlign і valign
- •Атрибут border
- •Атрибут cellspacing
- •Атрибут bgcolor
- •Атрибут background
- •Використання таблиць в дизайні сторінки
- •Лекція 7. Використання html-форм
- •Html-Форми
- •Завдання форми - елемент form
- •Атрибут cols
- •Атрибут name
- •Атрибут rows
- •Алгоритм роботи фреймів
- •Створення простої сторінки з фреймами
- •Завдання фреймової структури
- •Підготовка вмісту фрейма
- •Підготовка фрейму main
- •Атрибути rows і соls
- •Атрибут rows
- •Атрибут сols
- •Атрибут nаме
- •Атрибут маrginwidth
- •Атрибут маrginheight
- •Атрибут scrolling
- •Атрибут noresize
- •Атрибут srс
- •Атрибут таrgет
- •Вкладені і множинні кадрові структури
- •Лекція 9. Призначення і застосування каскадних таблиць стилів css
- •Призначення css
- •Способи застосування css
- •Перевизначення стилю
- •Елемент style
- •Посилання на зовнішній опис
- •Імпорт опису стилів
- •Селектор - ім'я елемента розмітки
- •Селектор - ім'я класу
- •Селектор - ідентифікатор об'єкта
- •Спадкування й перевизначення
- •Лекція 10. Блокові і стрічкові елементи css
- •Блокові і стрічкові елементи
- •Елемент div
- •Елемент span
- •Властивості блоків
- •Відступи (margin)
- •Набивання (padding)
- •Рамка (border)
- •Обтікання блоку тексту
- •Лекція 11.Позиціонування у css
- •Координати і розміри
- •Абсолютні координати
- •Відносні координати
- •Лінійні розміри блоку
- •Управління видимістю
- •Порядок накладення і область видимості
- •Порядок накладення блоків. Z-index
- •Область видимості блоку. Clip
- •Лекція 12. Призначення та застосування JavaScript.
- •Метод join ()
- •Метод reverse ()
- •Метод sort ()
- •Оператори мови
- •Лекція 14. Об'єктна модель броузера.
Групи тегів нтмl
Всі теги НТМL за їх призначенням і області дії можна розділити на наступні основні групи:
визначають структуру документа;
оформлення блоків гіпертексту (параграфи, списки , таблиці, картинки);
гіпертекстові посилання і закладки;
форми для організації діалогу;
виклик програм.
Структура гіпертекстової мережі задається гіпертекстовими посиланнями. Гіпертекстова посилання - це адреса іншого HTML-документа або інформаційного ресурсу Internet, який тематично, логічно або будь-яким іншим способом пов'язаний з документом, в якому посилання визначена.
Природно, при таких умовах дуже важлива схема адресації всіх наявних інформаційних ресурсів.
Реальний механізм інтерпретації ідентифікатора ресурсу, що спирається на URI (Uniform Resource Identifier, універсальний ідентифікатор ресурсу), називається URL, і користувачі WWW мають справу саме з ним.
Типовим прикладом використання такого запису можна вважати наступний приклад:
Цей текст містить:
<A HREF = "http:/ / www.snu.edu.ua / help / ../index.html ">
гіпертекстове посилання </ A>
Виглядати це буде наступним чином:
Рис. 1.1.
У наведеному вище прикладі тег "A", який в HTML називають якорем (anchor), використовує атрибут HREF, що позначає гіпертекстове посилання (Hypertext Reference), для запису цього посилання у формі URL. Це посилання вказує на документ з ім'ям "../index.html" в каталозі "help" на сервері "www.intuit.ru", доступ до якого здійснюється по протоколу HTTP.
Гіпертекстові посилання у HTML діляться на два класи: контекстні гіпертекстові посилання і загальні. Контекстні посилання вмонтовані в тіло документа, як це було продемонстровано у попередньому прикладі, в той час як загальні посилання пов'язані з усім документом у цілому і можуть використовуватися при перегляді будь-якого фрагмента документа. Обидва класи посилань спочатку присутні в стандарті мови, однак перший час найбільшою популярністю користувалися контекстні посилання. Ця популярність призвела до того, що механізм використання загальних посилань практично повністю "атрофувався". У даному прикладі ми уклали URL в подвійні лапки. Насправді, це необов'язково. Лапки (подвійні або одинарні) застосовуються тільки тоді, коли посеред значення URL з'являються символи-роздільники (пробіл, табуляція, неотображаемие символи). Але такого сорту URL слід всіляко уникати.
Структура HTML-документа дозволяє задіяти вкладені одна в одну контейнери. Власне, сам документ - це один великий контейнер, який починається з тега <HTML> і закінчується тегом </ HTML>.
На закінчення відзначимо, що при підготовці документів HTML використовується ідентифікатор тексту DTD (Document Type Definition, визначення типу документа) в якості першої рядка. Це дозволяє браузеру ідентифікувати документ як відповідний стандарту HTML. Зазвичай (але не обов'язково) кожний документ HTML починається з рядка типу:
<! DOCTYPE HTML PUBLIC "- / / W3C / / DTD HTML 4.0 Transitional / / EN">
Тут міститься інформація про те, що документ відповідає версії HTML 4.0; розробленої W3C ; використовувана мова - англійська.