IP_PIbd-21_Ihonkina_E.S./site/index.html
2023-02-21 14:01:58 +04:00

93 lines
4.9 KiB
HTML

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.11.6/dist/umd/popper.min.js" integrity="sha384-oBqDVmMz9ATKxIep9tiCxS/Z9fNfEXiDAYTujMAeBAsjFuCZSmKbSSUnQlmh/jp3" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.min.js" integrity="sha384-cuYeSxntonz0PPNlHhBs68uyIAVpIIOZZ5JqeqvYYIcEL727kskC66kF92t6Xl2V" crossorigin="anonymous"></script>
<title>Друг Драго</title>
</head>
<body>
<div class="container">
<div class="drago place text-center" style="margin-top: 10%">
<div class="row">
<div class="col-5">
<div class='film-image img-fluid'>
<img class="film-image img-fluid" src="Image/drago.png">
</div>
</div>
<div class="col-7">
<div class="card text-bg-success mb-3" style="max-width: 18rem;">
<div class="card-header">Драго говорит:</div>
<div class="card-body" style="background: #2f9365">
<p class="card-title" id="my-card-text"></p>
</div>
</div>
<h2 style="margin-top: 10%">Давай поиграем?</h2>
<form id="calculator-form" style="margin-top: 3%">
<div class="row">
<div class="col-md-9">
<div class="input-group">
<span class="input-group-text">Твоё имя:</span>
<input class="form-control" id="yourname"></input>
</div>
</div>
<div class="col-md-3">
<button type="button" class="btn btn-success" id="hello-button">Поздороваться</button>
</div>
<div class="row" style="margin-top: 3%">
<div class="col">
<label for="number-1" class="form-label">Первое число</label>
<input type="number" class="form-control" value="0" id="number-1" />
</div>
<div class="col">
<label for="operation" class="form-label">Действие</label>
<select class="form-select" id="operation">
<option value="1">+</option>
<option value="2">-</option>
<option value="3">*</option>
<option value="4">/</option>
</select>
</div>
<div class="col">
<label for="number-2" class="form-label">Второе число</label>
<input type="number" class="form-control" value="0" id="number-2" />
</div>
<div class="col">
<button type="button" class="btn btn-success" id="calculate-button">Посчитать</button>
</div>
</div>
<div class="row" style="margin-top: 3%">
<div class="input-group">
<span class="input-group-text">Твой массив:</span>
<input class="form-control" id="array"></input>
</div>
</div>
<div class="row" style="margin-top: 3%">
<div class="col-md-4">
<label for="arrayin" class="form-label">Число для умножения</label>
<input type="number" class="form-control" value="0" id="arrayin" />
</div>
<div class="col-md-3">
<button type="button" class="btn btn-success" id="do-button">Умножить массив</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<script src="script.js"></script>
</body>
</html>