Pibd-21_Alekseev_I.S._Inter.../IP/index.html
VanyaAlekseev ccc3e790bb lab2
2023-12-03 16:59:28 +04:00

122 lines
6.6 KiB
HTML
Raw 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>YourHome</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">
<main class="container-fluid">
<div class="row">
<div class="col-md-6">
<div class="text-center">
<div id="myCarousel" class="carousel slide" data-bs-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<img src="1pic.jpg" class="d-block w-100" alt="Slide 1">
</div>
<div class="carousel-item">
<img src="2pic.jpg" class="d-block w-100" alt="Slide 2">
</div>
<div class="carousel-item">
<img src="3pic.jpg" class="d-block w-100" alt="Slide 3">
</div>
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#myCarousel" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#myCarousel" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
</div>
</div>
<div class="col-md-6">
<div class="text-center">
<header class="header1-fluid">
<nav class="navbar navbar-expand-md navbar-dark">
<a class="navbar-brand" href="/">
<i class="fa-solid fa-house-chimney"></i>
YourHome
</a>
<!-- Кнопка, которая поялвяется при узком экране и позволяте развернуть навигационное меню-->
<button class="navbar-toggler custom-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" href="./page2.html">Магазин</a>
<a class="nav-link" href="./page4.html">О нас</a>
<a class="nav-link" href="./page3.html">Войти</a>
<a class="nav-link" href="./page5.html">Администратору</a>
</div>
</div>
</nav>
</header>
<h1>Поможем подобрать для Вас жильё!</h1>
<a href="./page2.html" class="btn btn-info text-white custom-rounded-btn btn-lg btn-custom">Узнать подробнее</a>
<div class="container mt-5">
<div class="row">
<div class="col-md-4">
<div class="card mb-4 h-10">
<img src="prod1.jpg" class="card-img-top custom-image" alt="Product Image">
<div class="card-body">
<h5 class="card-title text-truncate">Дом «Лебедь»</h5>
<ul class="list-group list-group-flush">
<li class="list-group-item"><strong>Площадь дома:</strong> 220 м2</li>
<li class="list-group-item"><strong>Цена:</strong> 10 500 000 руб</li>
</ul>
<a href="#" class="btn btn-custom mt-3">Купить</a>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card mb-4 h-10">
<img src="prod2.jpg" class="card-img-top custom-image" alt="Product Image">
<div class="card-body">
<h5 class="card-title text-truncate">Дом Вашей мечты</h5>
<ul class="list-group list-group-flush">
<li class="list-group-item"><strong>Площадь дома:</strong> 230 м2</li>
<li class="list-group-item"><strong>Цена:</strong> 20 500 000 руб</li>
</ul>
<a href="#" class="btn btn-custom mt-3">Купить</a>
</div>
</div>
</div>
<div class="col-md-4">
<div class="card mb-4 h-10">
<img src="prod3.jpg" class="card-img-top custom-image" alt="Product Image">
<div class="card-body">
<h5 class="card-title text-truncate">Элитная вилла</h5>
<ul class="list-group list-group-flush">
<li class="list-group-item"><strong>Площадь дома:</strong> 250 м2</li>
<li class="list-group-item"><strong>Цена:</strong> 30 500 000 руб</li>
</ul>
<a href="#" class="btn btn-custom mt-3">Купить</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</main>
<footer class="footer mt-auto d-flex flex-shrink-0 justify-content-center align-items-center">
Алексеев Иван, ПИбд-21
</footer>
</body>
</html>