Untitled
unknown
plain_text
2 months ago
3.8 kB
4
Indexable
<!DOCTYPE html> <html lang="id"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Kalkulator BMI</title> <style> * { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; } body { min-height: 100vh; background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); display: flex; justify-content: center; align-items: center; padding: 20px; } .container { background: rgba(255, 255, 255, 0.9); padding: 30px; border-radius: 20px; box-shadow: 0 15px 30px rgba(0, 0, 0, 0.2); width: 100%; max-width: 500px; } h1 { text-align: center; color: #2d3748; margin-bottom: 30px; font-size: 2.5em; } .form-group { margin-bottom: 20px; } label { display: block; margin-bottom: 8px; color: #4a5568; font-weight: 600; } input { width: 100%; padding: 12px; border: 2px solid #cbd5e0; border-radius: 8px; font-size: 16px; transition: border-color 0.3s ease; } input:focus { outline: none; border-color: #667eea; } button { width: 100%; padding: 14px; background: #667eea; color: white; border: none; border-radius: 8px; font-size: 16px; font-weight: 600; cursor: pointer; transition: background 0.3s ease; } button:hover { background: #5a67d8; } .result { margin-top: 30px; padding: 20px; border-radius: 8px; text-align: center; display: none; } .result.normal { background: #c6f6d5; border: 2px solid #48bb78; } .result.warning { background: #feebc8; border: 2px solid #ed8936; } .result.danger { background: #fed7d7; border: 2px solid #f56565; } .result h2 { color: #2d3748; margin-bottom: 10px; } .result p { color: #4a5568; font-size: 18px; } @media (max-width: 480px) { .container { padding: 20px; } h1 { font-size: 2em; } } </style> </head> <body> <div class="container"> <h1>Kalkulator BMI</h1> <form action="proses.php" method="POST"> <div class="form-group"> <label for="berat">Berat Badan (kg)</label> <input type="number" step="0.1" id="berat" name="berat" required> </div> <div class="form-group"> <label for="tinggi">Tinggi Badan (cm)</label> <input type="number" step="0.1" id="tinggi" name="tinggi" required> </div> <button type="submit">Hitung BMI</button> </form> <?php if(isset($_GET['bmi']) && isset($_GET['kategori'])): ?> <div class="result <?php echo strtolower($_GET['kategori']); ?>"> <h2>Hasil Perhitungan</h2> <p>BMI Anda: <?php echo number_format($_GET['bmi'], 1); ?></p> <p>Kategori: <?php echo $_GET['kategori']; ?></p> </div> <?php endif; ?> </div> </body> </html>
Editor is loading...
Leave a Comment