Лабораторна робота №3

  • Частина 1 Створити тестову сторінку, використовуючи Bootstrap
Створити 3 документи: 1) html файл. в <title> написати будь-яке своє питання. у частині <body> <h1> записати відповідь. підключити посилання на файл main.css i bootstrap.main.css. Створити класи для зміни стилю сторінки. 2) Створити файл main.css, в якому змінити налаштування фонового кольору та колір і розмір відповіді. 3) Створити файл bootstrap.main.css. Завантажити з сайту https://getbootstrap.com/ папку з даними. Знайти у папці файл bootstrap.main.css та скопіювати всі дані у свій створений файл. 

Продемонструвати створену сторінку. у звіт завантажити скріншот сторінки.


  • Частина 2 Створити сайт-меню для ресторану, використовуючи jquery
Створити сайт-меню для ресторану - створити файл html, створити 2 заголовки <h1> i <h2>. 
В <body> створити 3 блоки з різними типами страв, в кожному написати назву страви, ціну та загальний опис, для опису блюда використати тег <small>.
Наприклад: 
<div class="salat">
    <p>Капрезе по-грузинськи <span class="price">$5</span><br />
        <small>імеретинський сир, помідори, зелень, тархун, зелений соус</small></p>
</div>

Створити main.css, в якому змінити стилі фону, заголовків, тексту, зображень блюд, відображення вартості блюд. Для кожного класу створити окремі стилі відображення.

В розділі <head> зробити посилання для зміни шрифта у <h1>. Шрифти повинні завантажуватись з сайту https://fonts.google.com.

В папку Script завантажити з сайту https://jquery.com/download/ останню версію та в розділі <head> зробити посилання такого типу:
<script src="script/jquery-3.6.3.min.js"></script>

Зробити налаштування для відображення сторінки на смартфоні, створити медіа-запит @media

Приклад сторінки зі вспливаючим меню з описом страв.