Spaces:
Running
Running
File size: 2,264 Bytes
9ff76f0 9fbd00f fcd7628 9ff76f0 af437bf fcd7628 e177352 fcd7628 e177352 d2bfa26 e177352 fcd7628 9fbd00f fcd7628 9fbd00f fcd7628 e177352 d53e7dd fcd7628 e177352 fcd7628 d2bfa26 e177352 d2bfa26 e177352 fcd7628 e177352 d53e7dd 9fbd00f 9ff76f0 4ed7334 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Currency Converter</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<header class="navbar">
<div class="logo">Currency Converter</div>
</header>
<section class="headline">
<h1>Welcome to the Currency Converter</h1>
<p>Convert your currencies easily and instantly!</p>
</section>
<section class="converter">
<h2>Currency Converter</h2>
<input type="number" id="amount" placeholder="Enter Amount" class="amount-input" />
<div class="currency-container">
<select id="from-currency" class="currency-select">
<option value="USD">USD - United States Dollar</option>
<option value="EUR">EUR - Euro</option>
<!-- Add other currencies here -->
</select>
<button id="swap-btn" onclick="swapCurrencies()">Swap</button>
<select id="to-currency" class="currency-select">
<option value="EUR">EUR - Euro</option>
<option value="USD">USD - United States Dollar</option>
<!-- Add other currencies here -->
</select>
</div>
<button id="convert-btn">Convert</button>
<div id="result"></div>
</section>
<section class="how-to-use">
<h3>How to Convert</h3>
<div class="steps">
<div class="step">
<strong>1. Enter the Amount</strong>
<p>Simply type the amount you want to convert in the input box.</p>
</div>
<div class="step">
<strong>2. Select Your Currencies</strong>
<p>Choose USD in the first option and EUR in the second option.</p>
</div>
<div class="step">
<strong>3. That's It</strong>
<p>Your conversion result will be displayed.</p>
</div>
</div>
</section>
<footer class="footer">
<p>© 2025 Currency Converter. All Rights Reserved.</p>
</footer>
<script src="script.js"></script>
</body>
</html> |