
- •Міністерство освіти і науки, молоді та спорту України
- •Методичні вказівки
- •"Комп'ютерні мережі"
- •Лабораторна робота № 1 Апаратне забезпечення комп'ютерних мереж. Топології мереж
- •1.1. Теоретичні відомості
- •1.1.1. Топології мереж
- •1.1.2. Базові топології
- •1.1.2.1. Загальна шина (bus)
- •1.1.3. Комунікаційні пристрої
- •1.2. Практична частина
- •1.3. Контрольні питання
- •Лабораторна робота № 2
- •2.1.1.3. Утиліта tracert
- •2.1.1.4. Утиліта arp
- •2.1.1.5. Мережеві команди Net
- •2.1.1.6. Утиліта Net help
- •2.1.1.9. Утиліта Route
- •2.1.2. Сервіс Whois
- •2.3. Контрольні питання
- •Лабораторна робота № 3 Пошук інформації в мережі Інтернет. Принципи роботи з пошуковими серверами
- •3.1. Теоретичні відомості
- •3.1.1. Складові пошукових систем
- •3.1.2. Релевантність
- •3.2. Практична частина
- •3.3. Контрольні питання
- •Лабораторна робота № 4. Html. Створення сторінок
- •4.1. Теоретичні відомості
- •4.1.1. Структура html- документа
- •4.1.2. Теги рівня документа
- •4.1.3. Основні теги форматування тексту
- •4.2. Практична частина
- •4.3. Контрольні питання
- •5.1.2. Списки
- •5.1.2.3. Список визначень
- •5.1.3. Посилання
- •5.2. Практична частина
- •5.3. Контрольні питання
- •6.1 Теоретичні відомості
- •6.1.1. Таблиці. Загальні відомості
- •6.2. Практична частина
- •6.3. Контрольні питання
- •Лабораторна робота № 7. Програмування форм
- •7.1 Теоретичні відомості
- •7.1.1. Форми. Загальні відомості
- •7.1.3. Поле для паролів
- •7.1.4. Багатострічкове текстове поле
- •7.1.5. Меню
- •7.1.8. Кнопки reset та submit
- •7.2. Практична частина
- •7.3. Контрольні питання
- •Лабораторна робота № 8. Створення фреймів
- •8. Теоретичні відомості
- •8.2. Практична частина
- •8.3. Контрольні питання
- •Лабораторна робота № 9. Використання каскадних таблиць стилів (css)
- •9. Теоретичні відомості
- •9.1. Стилі. Загальні відомості
- •9.2. Практична частина
- •9.3. Контрольні питання
- •Список літератури Основна
- •Додаткова
- •Додаток 1
8.2. Практична частина
1. Створити свій електронний розклад занять:
при виборі навчального тижня в центральному вікні повинен відображатися розклад на весь тиждень.
при виборі певного дня тижня - тільки пари, які є в цей день.
вікно з тижнями повинно бути фіксованого розміру, а вікно з днями тижня має змінювати свій розмір залежно від розміру області, яка переглядається. Розмір кордонів фреймів, їх колір і колір фону можуть бути довільні (але не стандартні).
Для відображення потрібних сторінок в центральному вікні використовувати властивості TARGET.
Для визначення кількості та структури фреймів використовувати властивості тегу <FRAMESET>.
ЕЛЕКТРОННИЙ РОЗКЛАД ЗАНЯТЬ
тиждень
23-29 жовтня
16-22 жовтня
9-15 жовтня
2-8 жовтня
дні
1 пара
2 пара
3 пара
4 пара
5 пара
6 пара
Понеділок
Вівторок
Середа
Четвер
П'ятниця
Субота
Показати і захистити виконану роботу викладачеві.
8.3. Контрольні питання
Яким тегом відкривається фрейм?
Як фрейми розташовуються на екрані: горизонтально або вертикально? Наведіть приклади.
Для чого використовується параметр scrolling ="..." тегу FRAME?
Для чого використовується параметр name ="..." тегу FRAME?
Що означає тег <FRAMESET ROWS="20%,3*,*"> ?
Що означає тег <FRAMESET ROWS="*,60%,*">?
Що означає тег <FRAMESET COLS="25%, 75%"> ?
Що означає тег <FRAMESET ROWS="*,50%,*"> ?
Лабораторна робота № 9. Використання каскадних таблиць стилів (css)
Мета роботи: вивчити підключення таблиць стилів до документа, навчитися змінювати css-файли.
9. Теоретичні відомості
9.1. Стилі. Загальні відомості
Таблиці стилів, так звані CSS (Cascading Style Sheets) містять опис формату частини або цілого тексту. Задання стилю відбувається за допомогою тегу <style>…</style>.
<head>
<style>
тег {властивість1:значення1; ...;властивістьN:значенняN}
</style>
</head>
Таблиці стилів можуть розміщуватися в окремому файлі, що дозволяє звертатися до них всім сторінкам певного сайту. Тоді в межах тегу <head> вставляється посилання на файл зі стилями:
<link rel="stylesheet" type="text/css" hreaf="x.css">
За допомогою стилів ми можемо змінити вигляд тегів h, p, body, table тощо. Наприклад, задання стилю body {background:honeydew} означає, що лише вказуючи тег body він завжди позначатиме фон кольору honeydew.
Можна також вводити власні стилі. Наприклад, стиль .blue {color:blue} означає, що текст буде написаний блакитним кольором.
При використанні стилів доцільно користуватись тегом <div> - він не форматує документ, але помічає фрагмент тексту, який розглядатиметься як єдиний об'єкт. Тоді для цього об'єкта можна вказати певний стиль форматування <div class=blue> При цьому всередині тегу <div> можуть бути розміщені й інші елементи та теги.
Стильових ефектів є досить багато. З їх допомогою можна оформити веб-сторінку оригінально, різноманітніше, ніж за допомогою звичайних тегів. Приклади ефектів оформлення дивись у таблиці 8.1.
Таблиця 8.1 - Властивості тексту
№ |
Властивість (можливі значення) |
Призначення властивості |
1 |
font-family (Arial | Times New Roman | Courier | Tahoma) |
назва шрифту |
2 |
font-weight (normal | bold | lighter) |
насиченість шрифту (ширина букв) |
3 |
font-size (small | large | medium | 120% | 14px) |
розмір шрифту |
4 |
font-style (normal | italic) |
стиль шрифту (зазвичай курсив) |
5 |
font-stretch (normal | width | condensed | expanded) |
розтягнуте накреслення шрифту |
6 |
text-indent (число px | %) |
відступ першого рядка, при негативному значенні - виступ |
7 |
text-align (left | center | right | justify) |
горизонтальне вирівнювання |
8 |
line-height (normal |…px |…% |…em) |
висота рядка (міжрядковий інтервал) |
9 |
vertical-align (sub | sup | top | middle | bottom) |
вертикальне вирівнювання тексту в контейнері |
10 |
word-spacing (… px| normal) |
відстань між словами |
11 |
letter-spacing (… px| normal) |
відстань між буквами |
12 |
text-transform (uppercase | lowercase | capitalize | none) |
регістр букв |
13 |
text-decoration (none | underline | overline | line-through) |
оформлення тексту |
14 |
text-shadow (цвет длина длина) |
тінь до тексту |
15 |
white-space (normal | nowrap | pre) |
обробка пробілів |
16 |
Color |
колір |