<html lang="id"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Sayangadget</title> <style> body { font-family: Arial, sans-serif; background-color: #f4f4f9; margin: 0; padding: 0; } header { background-color: #4CAF50; color: white; text-align: center; padding: 20px; } .container { width: 80%; margin: auto; padding: 20px; } .gadget-card { background-color: white; border: 1px solid #ddd; border-radius: 10px; padding: 15px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); margin: 15px 0; } .gadget-card img { max-width: 100%; border-radius: 10px; } .gadget-info { margin-top: 10px; } .gadget-info h3 { margin: 0; } .gadget-info p { font-size: 1.2em; } footer { text-align: center; background-color: #4CAF50; color: white; padding: 10px; position: fixed; bottom: 0; width: 100%; } </style> </head> <body> <header> <h1>Selamat Datang di Sayangadget</h1> <p>Temukan gadget terbaru yang Anda sukai!</p> </header> <div class="container"> <div class="gadget-card"> <img src="https://via.placeholder.com/400x300" alt="Gadget 1"> <div class="gadget-info"> <h3>Smartphone XYZ 2024</h3> <p><strong>Harga:</strong> Rp 8.000.000</p> <p><strong>Fitur:</strong> Layar AMOLED, Kamera 108 MP, Prosesor Octa-Core</p> </div> </div> <div class="gadget-card"> <img src="https://via.placeholder.com/400x300" alt="Gadget 2"> <div class="gadget-info"> <h3>Laptop ABC 15-Inch</h3> <p><strong>Harga:</strong> Rp 12.000.000</p> <p><strong>Fitur:</strong> Intel i7, RAM 16 GB, SSD 512 GB</p> </div> </div> <div class="gadget-card"> <img src="https://via.placeholder.com/400x300" alt="Gadget 3"> <div class="gadget-info"> <h3>Smartwatch DEF</h3> <p><strong>Harga:</strong> Rp 2.500.000</p> <p><strong>Fitur:</strong> Monitoring Kesehatan, GPS, Tahan Air</p> </div> </div> </div> <footer> <p>© 2024 Sayangadget. Semua Hak Cipta Dilindungi.</p> </footer> </body> </html>
0 komentar:
Posting Komentar