Untitled
unknown
plain_text
2 years ago
3.1 kB
5
Indexable
I apologize for any confusion. You should copy the entire code that I provided in my previous messages. Here's the complete code for your convenience: ```html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>My Smooth and Beautiful Website</title> <style> /* CSS styles for beautiful design */ body { font-family: Arial, sans-serif; background-color: #f4f4f4; margin: 0; padding: 0; } header { text-align: center; background-color: #007BFF; color: white; padding: 20px; } main { max-width: 600px; margin: 20px auto; background-color: white; padding: 20px; border-radius: 10px; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); } button { background-color: #007BFF; color: white; border: none; padding: 10px 20px; cursor: pointer; transition: background-color 0.3s ease; } button:hover { background-color: #0056b3; } label { display: block; margin-bottom: 10px; } input[type="text"] { width: 100%; padding: 10px; margin-bottom: 20px; border: 1px solid #ccc; border-radius: 5px; } #greeting { font-size: 18px; } footer { text-align: center; background-color: #333; color: white; padding: 10px 0; } </style> </head> <body> <header> <h1>Welcome to My Smooth and Beautiful Website</h1> </header> <main> <button id="myButton">Click Me</button> <form id="myForm"> <label for="name">Enter Your Name:</label> <input type="text" id="name" required> <button type="submit">Submit</button> </form> <div id="greeting"></div> </main> <footer> <p>© 2023 My Smooth and Beautiful Website</p> </footer> <script> // JavaScript code (unchanged) document.getElementById("myButton").addEventListener("click", function() { alert("Button Clicked!"); }); document.getElementById("myForm").addEventListener("submit", function(event) { event.preventDefault(); // Prevent form submission const name = document.getElementById("name").value.trim(); if (name) { document.getElementById("greeting").textContent = `Hello, ${name}!`; } else { document.getElementById("greeting").textContent = "Please enter your name."; } }); </script> </body> </html> ``` Copy this entire code and paste it into a text editor or code editor of your choice. Save the file with an `.html` extension and open it in a web browser to view the webpage.
Editor is loading...