Теоретичні відомості
Введемо тепер в наш шаблон нові теги.
<tutle> Назва моєї сторінки </title>
Цей тег виводить заголовок на панелі заголовка сторінки, яку ви створюєте. Текст між тегами може бути будь-який. Цей тег поміщається між тегами <head> </head>. Тобто:
<html>
<head>
<title> Моя сторінка </title>
</head>
<body>
…
</body>
<html>
В тілі сторінки використовуються текстові теги:
<p> text </p> |
Параграф (звичайний текст) |
<h1> text </h1> |
Заголовок (найбільший шрифт) |
<h2> text </h2> |
Підзаголовок (менше за h1) |
<h3> text </h3> |
Підзаголовок (менше за h2) |
<h4> text </h4> |
Підзаголовок (менше за h3) |
<h5> text </h5> |
Підзаголовок (менше за h4) |
<h6> text </h6> |
Підзаголовок (менше за h5) |
<b> text </b> |
Bold – жирний шрифт |
<i> text </i> |
Italic – курсивний шрифт |
<small> text </small> |
Зменшений шрифт |
<br /> |
Перейти на новий рядок |
Завдання 2:
Наберіть в редакторі «Блокнот» текст сторінки з використанням всіх перелічених типів шрифтів:
<html>
<head>
<title> назва моєї сторінки </title>
</head>
<body>
<p> Моя перша сторінка </p>
<h1> Це заголовок </h1>
<h2> Це підзаголовок </h2>
<h3> Це підзаголовок </h3>
<h4> Це підзаголовок </h4>
<h5> Це підзаголовок </h5>
<h6> Це підзаголовок </h6>
<b> жирний шрифт </b>
<i> курсив </i>
<small> зменшений шрифт </small>
</body>
</html>
Збережіть файл з текстом сторінки під іменем page1.htm в папці C:\webpage
Запустіть файл page1.htm і подивіться на результат виведення. Порівняйте відображення різних шрифтів.
Завдання 3 (самостійне):
Напишіть WEB-сторінку з наступним текстом, використовуючи для оформлення тексту відповідні теги.
КОНСТИТУЦІЯ УКРАЇНИ
Розділ I ЗАГАЛЬНІ ЗАСАДИ
Стаття 1. Україна є суверенна і незалежна, демократична,соціальна, правова держава.
Стаття 2. Суверенітет України поширюється на всю її територію.
Україна є унітарною державою.
Територія України в межах існуючого кордону є цілісною і недоторканною.
Стаття 3. Людина, її життя і здоров’я, честь і гідність,недоторканність і безпека визнаються в Україні найвищою соціальною цінністю.
Права і свободи людини та їх гарантії визначають зміст і спрямованість діяльності держави. Держава відповідає перед людиною за свою діяльність. Утвердження і забезпечення прав і свобод людини є головним обов’язком держави.
Практичне заняття 2
Тема: Елементи оформлення тексту. Атрибути.
Програмні засоби: редактор Блокнот, браузер Explorer або Opera.
Теоретичні відомості.
В попередньому занятті ми вивчили структуру WEB-сторінки (шаблон). При написанні сторінок слід дотримуватись правила : роботу завжди починати з базового шаблона, а потім вставляти в нього інші елементи.
Це правило позбавить вас від проблем з пропуском елементів шаблону, які завжди виникають якщо його не дотримуватись.
Настав час додати до відомих нам тегів елементи оформлення тексту.
По-перше зазначимо, що при використанні текстових тегів їх можна об’єднувати. Тобто, якщо необхідно вивести текст жирним курсивом – необхідно застосувати два теги :
<b><i> text </i></b>
Зверніть увагу на порядок запису тегів – тег відкритий першим закривається останнім, зміна порядку неприпустима:
<b><i> text </b></i> - такий порядок є помилковим
Додамо ще один тег :
<hr /> - виводить горизонтальну лінію
Одним з видів оформлення тексту є виведення списків (наприклад список групи, список товарів, тощо…). Списки можна поділити на два типи : впорядковані (нумеровані) і невпорядковані (ненумеровані). Перед кодним елементом впорядкованого списку стоїть його порядковий номер, а перед елементами невпорядкованого списку ставить мітка у вигляді жирної крапки (кнопки). Для виведення списків використовують наступні теги:
<ul> - unordered list – невпорядкований список
<ol> - ordered list – впорядкований список
Для опису елементів списку використовується тег :
<li> - list item – елемент списку
Приклади запису списків:
<ul> --- невпорядкований список відкрито
<li> А </li> --- елемент А
<li> Б </li> --- елемент Б
<li> В </li> --- елемент В
</ul> --- список закрито
Так само описується впорядкований список, тільки замість <ul> використовується <ol> , все інше залишається без змін.
Списки матимуть такий вигляд:
для невпорядкованого
А
Б
В
для впорядкованого
А
Б
В
Завдання1:
Написати сторінку на якій розмістити заголовок «Контингент учнів», підзаголовок «учні групи». Далі вивести список з п’яти прізвищ у вигляді впорядкованого списку, потім підкреслююча риска і невпорядкований список тих самих прізвищ.