Business Card Maker

Your Name

Your Job Title

Your Email

Your Phone Number

Name: Job Title: Email: Phone:

function updateCard() { var name = document.getElementById("nameInput").value; var jobTitle = document.getElementById("titleInput").value; var email = document.getElementById("emailInput").value; var phone = document.getElementById("phoneInput").value; document.getElementById("name").textContent = name; document.getElementById("job-title").textContent = jobTitle; document.getElementById("email").textContent = email; document.getElementById("phone").textContent = phone; } .business-card { border: 1px solid #ccc; border-radius: 5px; padding: 20px; width: 300px; margin: 20px auto; text-align: center; } .business-card h1 { margin-bottom: 5px; } .business-card p { margin: 5px 0; } input[type="text"], input[type="email"], input[type="tel"] { margin-bottom: 10px; width: 100%; } button { background-color: #4CAF50; color: white; padding: 10px 20px; border: none; border-radius: 5px; cursor: pointer; } button:hover { background-color: #45a049; } This example provides a basic interface for users to input their name, job title, email, and phone number. Upon clicking the "Update Card" button, the information will be displayed on a business card-like format above the input fields.