Internet_Programming_PIbd-2.../лаб2/прим1/page5.html
2023-11-09 22:45:49 +04:00

147 lines
9.6 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="./style5.css">
</head>
<body class=" d-flex flex-column">
<header>
<nav class="navbar navbar-expand-md navbar-dark">
<div class="container-fluid">
<a class="navbar-brand" href="/">
<name>
<img src ="images/logo.png" class="img-fluid" alt = "...">
Рарити шоп
</name>
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav"
aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-collapse collapse justify-content-end" id="navbarNav">
<div class="navbar-nav">
<a class="nav-link active" href="./index.html">Главная</a>
<a class="nav-link active" href="./page5.html">Каталог</a>
<a class="nav-link active" href="./page2.html">Контакты</a>
<a class="nav-link active" href="./page3.html">Личный кабинет</a>
<a class="nav-link active" href="./page9.html">Корзина</a>
</div>
</div>
</div>
</nav>
</header>
<main class="container-fluid p-2">
<div class="row">
<div class="col-4 h-100 w-25">
<div id="list-dresses" class="list-group">
<a class="list-group-item list-group-item-action" style="color: white; background-color: #50028C;" href="#list-item-1">Вечернее платье пышное</a>
<a class="list-group-item list-group-item-action" style="color: white; background-color: #50028C;" href="#list-item-2">Вечернее платье прямое</a>
<a class="list-group-item list-group-item-action" style="color: white; background-color: #50028C;" href="#list-item-3">Вечернее платье русалка</a>
<a class="list-group-item list-group-item-action" style="color: white; background-color: #50028C;" href="#list-item-4">Вечернее платье ампир</a>
<a class="list-group-item list-group-item-action" style="color: white; background-color: #50028C;" href="#list-item-5">Вечернее платье принцесса</a>
<a class="list-group-item list-group-item-action" style="color: white; background-color: #50028C;" href="#list-item-6">Свадебное платье пышное</a>
<a class="list-group-item list-group-item-action" style="color: white; background-color: #50028C;" href="#list-item-7">Свадебное платье прямое</a>
<a class="list-group-item list-group-item-action" style="color: white; background-color: #50028C;" href="#list-item-8">Свадебное платье русалка</a>
<a class="list-group-item list-group-item-action" style="color: white; background-color: #50028C;" href="#list-item-9">Свадебное платье ампир</a>
<a class="list-group-item list-group-item-action" style="color: white; background-color: #50028C;" href="#list-item-10">Свадебное платье принцесса</a>
</div>
</div>
<div class="col-8">
<div data-bs-spy="scroll" data-bs-target="#list-dresses" data-bs-smooth-scroll="true" class="scrollspy-example" tabindex="0">
<div class="row row-cols-1 row-cols-md-3 g-4">
<div class="col">
<div id = "list-item-1" class="card h-100" style="color: white; background-color: #1C7AAF; text-decoration: underline;">
<img src="images/платье вечернее пышное.png" class="cards card-img-top img-fluid" alt="...">
<div class="card-body">
<a class="nav-link active" href="./page6.html">Вечернее платье пышное</a>
</div>
</div>
</div>
<div class="col">
<div id = "list-item-2" class="card h-100" style="color: white; background-color: #1C7AAF; text-decoration: underline;">
<img src="images/платье вечернее прямое.png" class="cards card-img-top img-fluid" alt="...">
<div class="card-body">
<a class="nav-link active" href="./page4.html">Вечернее платье прямое</a>
</div>
</div>
</div>
<div class="col">
<div id = "list-item-3" class="card h-100" style="color: white; background-color: #1C7AAF; text-decoration: underline;">
<img src="images/вечернее платье русалка.png" class="cards card-img-top img-fluid" alt="...">
<div class="card-body">
<a class="nav-link active" href="./page4.html">Вечернее платье русалка</a>
</div>
</div>
</div>
<div class="col">
<div id = "list-item-4" class="card h-100" style="color: white; background-color: #1C7AAF; text-decoration: underline;">
<img src="images/вечернее платье ампир.png" class="cards card-img-top img-fluid" alt="...">
<div class="card-body">
<a class="nav-link active" href="./page4.html">Вечернее платье ампир</a>
</div>
</div>
</div>
<div class="col">
<div id = "list-item-5" class="card h-100" style="color: white; background-color: #1C7AAF; text-decoration: underline;">
<img src="images/платье вечернее принцесса.png" class="cards card-img-top img-fluid" alt="...">
<div class="card-body">
<a class="nav-link active" href="./page4.html">Вечернее платье принцесса</a>
</div>
</div>
</div>
<div class="col">
<div id = "list-item-6" class="card h-100" style="color: white; background-color: #1C7AAF; text-decoration: underline;">
<img src="images/платье свадебное пышное.png" class="cards card-img-top img-fluid" alt="...">
<div class="card-body">
<a class="nav-link active" href="./page4.html">Свадебное платье пышное</a>
</div>
</div>
</div>
<div class="col">
<div id = "list-item-7" class="card h-100" style="color: white; background-color: #1C7AAF; text-decoration: underline;">
<img src="images/свадебное платье.png" class="cards card-img-top img-fluid" alt="...">
<div class="card-body">
<a class="nav-link active" href="./page4.html">Свадебное платье прямое</a>
</div>
</div>
</div>
<div class="col">
<div id = "list-item-8" class="card h-100" style="color: white; background-color: #1C7AAF; text-decoration: underline;">
<img src="images/свадебное платье русалка.png" class="cards card-img-top img-fluid" alt="...">
<div class="card-body">
<a class="nav-link active" href="./page4.html">Свадебное платье русалка</a>
</div>
</div>
</div>
<div class="col">
<div id = "list-item-9" class="card h-100" style="color: white; background-color: #1C7AAF; text-decoration: underline;">
<img src="images/свадебное платье ампир.png" class="cards card-img-top img-fluid" alt="...">
<div class="card-body">
<a class="nav-link active" href="./page4.html">Свадебное платье ампир</a>
</div>
</div>
</div>
<div class="col">
<div id = "list-item-10" class="card h-100" style="color: white; background-color: #1C7AAF; text-decoration: underline;">
<img src="images/свадебное платье принцесса.png" class="cards card-img-top img-fluid" alt="...">
<div class="card-body">
<a class="nav-link active" href="./page4.html">Свадебное платье принцесса</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</main>
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-left align-items-left">
Рарити Шоп.ру Лёвушкина Анна ПИбд-21
</footer>
</body>
</html>