Levshin95
/
HW


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687
							<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>

    <div class="wrapper">
        <select id="product">
            <option value="пиво" id="pivo1">Пиво</option>
            <option value="кола" id="cola1">Кола</option>
            <option value="шоколад" id="cola1">Шоколад</option>
            <option value="чипсы" id="chips1">Чипсы</option>
            <option value="сиги" id="sigi1">Сигареты</option>
        </select>
        <input type="number" id="number" placeholder="Введите колличество">
        <button id="button">Купить</button>
    </div>
    <div class="availability">
        <h1>Наличие:</h1>
        <div style="display: flex; justify-content:space-around;">

            <div class="pivo2">

                <img src="images/pivo.jpg" alt="" style="max-height: 200px; max-width: 200px">
                <h2 style="text-align: center">Пиво: <span id="pivo"></span></h2>
                <h2 style="text-align: center">Цена: <span id="pivoK"></span></h2>

                
            </div>

            <div class="cola2">

                <img src="images/cola.jpg" alt="" style="max-height: 200px; max-width: 200px">
                <h2 style="text-align: center">Кола: <span id="cola"></span></h2>
                <h2 style="text-align: center">Цена: <span id="colaK"></span></h2>
                
            </div>

            <div class="chok2">

                <img src="images/chok.jpg" alt="" style="max-height: 200px;">
                <h2 style="text-align: center">Шоколад: <span id="chok"></span></h2>
                <h2 style="text-align: center">Цена: <span id="chokK"></span></h2>
                
            </div>

            <div class="chips2">

                <img src="images/chips.jpg" alt="" style="max-height: 200px; max-width: 200px">
                <h2 style="text-align: center">Чипсы: <span id="chips"></span></h2>
                <h2 style="text-align: center">Цена: <span id="chipsK"></span></h2>
                
            </div>

            <div class="sigi2">

                <img src="images/sigi.jfif" alt="" style="max-height: 200px; max-width: 200px">
                <h2 style="text-align: center">Сигареты: <span id="sigi"></span></h2>
                <h2 style="text-align: center">Цена: <span id="sigiK"></span></h2>
                
            </div>

        </div>
    </div>
    <hr>
    <div style="display: flex; justify-content:space-between;">

        <div class="cashbox">

            <h2>Касса: <span id="kassa"></span></h2>
            <img src="images/kassa.jpeg" alt="" style="max-height: 200px; max-width: 400px">
            
        </div>
        <div class="wallet">

            <h2>Остаток средств: <span id="money"></span></h2>
            <img src="images/kesh.jpg" alt="" style="max-height: 200px; max-width: 400px">
            
        </div>
        <script src="index.js"></script>
    </div>
</body>
</html>