This is default featured slide 1 title

Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.

This is default featured slide 2 title

Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.

This is default featured slide 3 title

Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.

This is default featured slide 4 title

Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.

This is default featured slide 5 title

Go to Blogger edit html and find these sentences.Now replace these sentences with your own descriptions.

HTML

By  November 21, 2024  No comments

 <!DOCTYPE html> <html lang="id"> <head> < <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content="Contoh kode HTML yang lebih sulit, menggabungkan berbagai elemen seperti tabel, formulir, dan multimedia."> <title>Contoh Kode HTML yang Sulit</title> <style> body { font-family: Arial, sans-serif; background-color: #f4f4f9; color: #333; margin: 0; padding: 0; } header { background-color: #4CAF50; color: white; text-align: center; padding: 1em; } nav { background-color: #333; overflow: hidden; } nav a { float: left; display: block; color: white; text-align: center; padding: 14px 20px; text-decoration: none; } nav a:hover { background-color: #ddd; color: black; } section { margin: 20px; } footer { background-color: #333; color: white; text-align: center; padding: 1em; position: fixed; bottom: 0; width: 100%; } .form-container { background-color: #fff; padding: 20px; border-radius: 8px; box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); max-width: 600px; margin: auto; } table { width: 100%; border-collapse: collapse; margin-top: 20px; } table, th, td { border: 1px solid #ddd; } th, td { padding: 10px; text-align: left; } th { background-color: #f2f2f2; } .media-container { display: flex; justify-content: center; gap: 20px; margin-top: 30px; } .media-container iframe { width: 560px; height: 315px; } </style> < </head> < <body> <header> <h1>Contoh Kode HTML yang Sulit</h1> <p>Memperlihatkan berbagai elemen HTML yang lebih kompleks.</p> </head </header> < <nav> <a href="#home">Beranda</a> <a href="#about">Tentang</a> <a href="#contact">Kontak</a> </nav </nav> <section> <h2>Tabel Informasi</h2> < <p>Berikut adalah contoh tabel yang menunjukkan data pengguna:</p> <table> <tr> <th>Nama</th> <th>Email</th> <th>Alamat</th> </tr> < <tr> <td>Andi</td> < <td>andi@email.com</td> <td>Jl. Merdeka No. 1</td> </tr> <tr> <td>Budi</td> <td>budi@email.com</td> <td>Jl. Raya No. 2</td> < </tr> <tr> <td>Citra</td> < <td>citra@email.com</td> < <td>Jl. Kebangsaan No. 3</td> </tr> </table </table> </sect </section> < <section> <h2>Formulir Pendaftaran</h2> <div class="form-container"> <form action="/submit" method="POST"> < <label for="name">Nama:</label><br> <input type="text" id="name" name="name" required><br><br> <label for="email">Email:</label><br> <input type="email" id="email" name="email" required><br><br> <label for="message">Pesan:</label><br> <textarea id="message" name="message" rows="4" required></textarea><br><br> <label for="subscribe">Berlangganan Newsletter:</label> <input type="checkbox" id="subscribe" name="subscribe" value="yes"><br><br> <input type="submit" value="Kirim"> </for </form> </d </div> </sec </section> <section class="media-container"> <div> <h2>Video YouTube</h2> <iframe src="https://www.youtube.com/embed/dQw4w9WgXcQ" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> </ </div> <div> <h2>Audio Player</h2> <audio controls> <source src="https://www.soundhelix.com/examples/mp3/SoundHelix-Song-1.mp3" type="audio/mp3"> Browser Anda tidak mendukung elemen audio. Browser Anda tidak mendukung elemen audio. Browser Anda tidak mendukung elemen a Browser Anda tidak mendukun Browser Anda tid </audio> </div> < </section> <footer> <p>&copy; 2024 Contoh Kode HTML yang Sulit. Semua hak dilindungi.</p> </footer> </ </body> </html>

Read More