Каскадні таблиці стилів. Стильове оформлення сторінок. Позиціювання елементів веб-сторінки за допомогою стилів

МІНІСТЕРСТВО ОСВІТИ І НАУКИ УКРАЇНИ

УНІВЕРСИТЕТ МИТНОЇ СПРАВИ ТА ФІНАНСІВ

Кафедра комп’ютерних наук та інженерії програмного забезпечення

Звіт

з лабораторної роботи №4

з дисципліни: «Web-технології та web-дизайн»

на тему: «Каскадні таблиці стилів. Стильове оформлення сторінок.

Позиціювання елементів веб-сторінки за допомогою стилів.»

                                 Виконав:

студент 2 курсу групи К20-2

Доманський Ф.Р.

                               Перевірив:

         Доцент Кафедри

Лебідь О.Ю.

Дніпро 2022

ЛАБОРАТОРНА РОБОТА № 4

Тема: Каскадні таблиці стилів. Стильове оформлення сторінок.

Позиціювання елементів веб-сторінки за допомогою стилів

Мета: засвоїти основні ідеї стильового оформлення сторінок за

допомогою каскадних стилів.

Завдання лабораторної роботи

1. За основу взяти файли, що створені під час виконання лабораторної

роботи 3. Спроектувати макет (рис. 1) головної сторінки та (або) інших

сторінок вашого сайту, використавши необхідні блоки за .

[pic 1]

Рис. 1. Макет веб-сторінки

2. Підключіть до веб-сторінок таблицю стилів style.css. Використати

різні шрифти (рис. 2-5) та зробити стильове оформлення на свій розсуд.

[pic 2]

Рис. 2

[pic 3]

Рис. 3

3. Щоб сайт виглядав коректно використати адаптивну верстку

(гумову, блокову) (рис. 4-5).

[pic 4]

Рис. 4

[pic 5]

Рис. 5

4. Створити псевдо кнопку з її динамічною зміною на головній сторінці

(або на ваш розсуд на інших сторінках сайту). Зразок реалізації на рис. 6-8

[pic 6]

Рис. 6

[pic 7]

Рис. 7. Код кнопки

[pic 8]

Рис. 8. СSS Кнопки

5. Оформити звіт з виконання лабораторної роботи.

Висновок: за допомогою цієі лабораторноі роботи я засвоїв основні ідеї стильового оформлення сторінок за допомогою каскадних стилів.