PIbd-21_Danilov_V.V._Intern.../Lab3/index.html
Владимир Данилов 83490711d5 отчет
2023-12-19 20:23:11 +04:00

140 lines
6.2 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<html lang="ru">
<head>
<meta charset = "utf-8">
<title> Техник </title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="module" src="./node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
<link href="./node_modules/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"/>
<link href="./node_modules/@fortawesome/fontawesome-free/css/all.min.css" rel="stylesheet"/>
<link rel = "stylesheet" href = "./style.css">
</head>
<body class="h-100 d-flex flex-column">
<header>
<nav class="navbar navbar-expand-md">
<div class="container-fluid">
<a class = "navbar-brand" href = "./" style="color: #6A3502;">
<i class="fa-solid fa-microchip"></i>
Техник
</a>
<form class="d-flex">
<input class="form-control" type="search" placeholder="Поиск по сайту" aria-label="Search">
<button class="btn btn-outline-*" type="submit" style="color: #6A3502;"><i class="fa-solid fa-search"></i></button>
</form>
<a class="nav-link" href="./Login.html">Вход</a>
</div>
</nav>
</header>
<main class="container-fluid" style="background-color: antiquewhite;">
<div class="row">
<article class="col-lg-3">
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCatalog"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<h3>Каталог</h3>
</button>
<div class="navbar-collapse collapse" id="navbarCatalog">
<div class="navbar-nav" style="background-color: white; border-radius: 12px;">
<li class="nav-item">
<a class="nav-link p-2" href="./Catalog.html?id=1"> Бытовая техника</a>
</li>
<li class="nav-item">
<a class="nav-link p-2" href="./Catalog.html?id=2"> Красота и здоровье</a>
</li>
<li class="nav-item">
<a class="nav-link p-2" href="./Catalog.html?id=3"> Смартфоны и фототехника</a>
</li>
<li class="nav-item">
<a class="nav-link p-2" href="./Catalog.html?id=4"> ТВ, консоли и аудио</a>
</li>
<li class="nav-item">
<a class="nav-link p-2" href="./Catalog.html?id=5"> ПК, ноутбуки, периферия</a>
</li>
<li class="nav-item">
<a class="nav-link p-2" href="./Catalog.html?id=6"> Комплектующие для ПК</a>
</li>
<li class="nav-item">
<a class="nav-link p-2" href="./Catalog.html?id=7"> Офис и мебель</a>
</li>
<li class="nav-item">
<a class="nav-link p-2" href="./Catalog.html?id=8"> Сетевое оборудование</a>
</li>
<li class="nav-item">
<a class="nav-link p-2" href="./Catalog.html?id=9"> Отдых и развлечения</a>
</li>
<li class="nav-item">
<a class="nav-link p-2" href="./Catalog.html?id=10"> Инструмент и стройка</a>
</li>
<li class="nav-item">
<a class="nav-link p-2" href="./Catalog.html?id=11"> Садовая техника</a>
</li>
<li class="nav-item">
<a class="nav-link p-2" href="./Catalog.html?id=12"> Дом, декор и посуда</a>
</li>
<li class="nav-item">
<a class="nav-link p-2" href="./Catalog.html?id=13"> Автотовары</a>
</li>
<li class="nav-item">
<a class="nav-link p-2" href="./Catalog.html?id=14"> Аксессуары и услуги</a>
</li>
<li class="nav-item">
<a class="nav-link p-2" href="./Catalog.html?id=15"> Распродажа</a>
</li>
</div>
</div>
</article>
<article class="col-lg-9">
<div class="p-2">
<div class="p-2" style="background-color: white; border-radius: 12px;">
<h2>Новости</h2>
<section class="row">
<article class="col-lg-4">
<a class="text-image" href="#"><img src="Image/News1.jpg" class="img-thumbnail">Скидка 10% на комплект КБТ</a>
</article>
<article class="col-lg-4">
<a class="text-image" href="#"><img src="Image/News2.jpg" class="img-thumbnail">Новинка! Электрическая кофемолка Reoka RKCG-P1</a>
</article>
<article class="col-lg-4">
<a class="text-image" href="#"><img src="Image/News3.jpg" class="img-thumbnail">Новинка! Мультистайлер Dyson Airwrap Styler Complete Long Lite HS05</a>
</article>
<article class="col-lg-4">
<a class="text-image" href="#"><img src="Image/News4.jpg" class="img-thumbnail">Новинка! Ноутбук Xiaomi Book 14</a>
</article>
</section>
</div>
</div>
<div class="p-2">
<div class="p-2" style="background-color: white; border-radius: 12px;">
<h2>Блоги</h2>
<section class="row">
<article class="col-lg-4">
<a class="text-image" href="#"><img src="Image/Blog1.jpg" class="img-thumbnail">Как выбрать осушитель воздуха</a>
</article>
<article class="col-lg-4">
<a class="text-image" href="#"><img src="Image/Blog2.png" class="img-thumbnail">Как настроить графику в Alan Wake 2</a>
</article>
<article class="col-lg-4">
<a class="text-image" href="#"><img src="Image/Blog3.png" class="img-thumbnail">Лучшие плагины для браузеров</a>
</article>
<article class="col-lg-4">
<a class="text-image" href="#"><img src="Image/Blog4.jpg" class="img-thumbnail">Самые ожидаемые игры - ноябрь 2023 года</a>
</article>
</section>
</div>
</div>
</article>
</div>
</main>
<footer class="footer mt-auto d-flex flex-shrink-0 align-items-center">
© 2023 Компания Техник. Администрация Сайта не несет ответственности за размещаемые Пользователями материалы (в т.ч. информацию и изображения), их содержание и качество.
</footer>
</body>
</html>