Стаття 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. А
2. Б
3. В
Завдання1:
Написати сторінку на якій розмістити заголовок «Контингент учнів», підзаголовок «учні групи». Далі вивести список з п’яти прізвищ у вигляді впорядкованого списку, потім підкреслююча риска і невпорядкований список тих самих прізвищ.
Теоретичні відомості.
Теги, які ми використовуємо для написання WEB-сторінок можуть мати додаткові атрибути, тобто додаткові налаштування. Атрибути вставляються в середину того тега до якого вони застосовуються. Якщо ви хочете застосувати деяку властивість для всієї сторінки – ви повинні додати атрибут до тега <body> , якщо тільки до одного рядка – то додаєте атрибут до тега <p> (або іншого, з якого починається рядок). Ми з вами вивчимо зараз один з атрибутів – style , який дозволяє задавати досить багато властивостей. Порядок запису атрибутів такий : атрибут = “параметри атрибута” . Наприклад, для зміни кольору сторінки ми можемо використати такий запис:
<body style="background-color:#ff0000;">
Цей запис зробить вашу сторінку червоного кольору. Код кольору являє собою шістнадцятіркове число (на це вказує символ # перед ним). Ось деякі інші кольори:
Білий: #ffffff
Чорний: #000000
Червоний: #ff0000
Синій: #0000ff
Зелений: #00ff00
Жовтий: #ffff00
Взагалі існує карта з 216 кольорів, що можуть використовуватись у WEB.
Крім того основні кольори можна вводити безпосередньо, наприклад :
<body style="background-color: red;"> ( або white, black, blue, green, yellow) Завдання2:Внесіть самостійно зміни в попереднє завдання зі списками так, щоб кожен елемент списку мав чергування зеленого та синього кольорів фону. Сторінку зробіть жовтою.Практичне заняття 3
Тема: Посилання.
Програмні засоби: редактор Блокнот, браузер Explorer або Opera.
Теоретичні відомості.Посилання – це спеціальні мітки призначені для переходу на іншу сторінку, на інше місце на тій самій сторінці або до будь-якого елемента електронного документа чи Internet-адреси. В якості мітки може бути будь-який елемент вашої сторінки. Найчастіше в якості посилання використовують текстовий рядок, який може бути певним чином оформлений у вигляді графічного об’єкту. Для виконання посилання використовується тег <a>з атрибутом href. В якості значення атрибута вказується місце переходу. Для прикладу будемо вважати, що ми переходимо на іншу сторінку яка називається page-2.htm, запис виглядатиме так:<a href=”page-2.htm”> перехід на page-2 </a>Напис «перехід на page-2» буде відображений на сторінці і виконувати роль гіперпосилання (саме на нього необхідно кліпнути для переходу). Сторінка на яку ми переходимо повинна знаходитись в тій самій папці, що і та сторінка з якої ви переходите. Якщо ви хочете перейти на сторінку, що знаходиться в іншому місці на диску, необхідно вказати повний шлях, наприклад, якщо сторінка знаходиться на диску d: в папці web:<a href=”d:\web\page-2.htm”> перехід на page-2 </a> Посилатися можна на Internet-сайт вказавши його URL-адресу:<a href=http://www.google.com.ua> перейти на GOOGLE </a> Якщо замість рядка, що відображається на сторінці, як посилання вставити інший об’єкт (наприклад графічний), то цей об’єкт стане посиланням на яке необхідно кліпнути для переходу. І зверніть увагу на те, що після посилання необхідно його закрити тегом </a>.Завдання1:1) Створіть головну сторінку з заголовком «Контингент учнів»2) Створіть другу сторінку з заголовком «Група 1» і створіть на ній нумерований список з п’яти учнів3) Збережіть головну сторінку під іменем index.htm4) Другу сторінку збережіть під іменем grupa-1.htm5) На головній сторінці створіть гіперпосилання на другу сторінку (на grupa-1.htm) і збережіть зміни.6) На другій сторінці після списку групи додайте гіперпосилання на головну сторінку (на index.htm) і збережіть зміни.7) Запустіть на виконання файл index.htm і перевірте роботу посилань на обох сторінках. Завдання 2 (самостійне):Створіть головну сторінку «Конституція України» і зробіть гіперпосилання на 1,2,3 статті розмістивши їх на окремих сторінках. З кожної сторінки необхідно зробити посилання для повернення на головну сторінку. При оформленні сторінок використати вивчені раніше елементи оформлення та атрибути кольору.
КОНСТИТУЦІЯ УКРАЇНИ