Ask AI on The Internet
Question: Write me html and css code to do animated login
form <HTML> <HEAD> <style> body { background: #0093b8; } .form-container { width: 500px; text-align: center; margin: auto; padding: 20px; background: #fff; box-shadow: 0 0 10px 0 #ccc; } .form { width: 80%; margin: auto; position: relative; } .form__input { position: absolute; top: 0; left: 0; width: 100%; padding: 20px; font-size: 20px; background: #fff; border: 0; outline: 0; box-shadow: 0 0 10px 0 #ccc; animation: popIn 0.2s 1; } .form__input:focus { box-shadow: 0 0 10px 0 #0093b8; } .form__button { width: 80%; padding: 20px; background: #0093b8; font-size: 20px; color: #fff; border: 0; outline: 0; margin-top: 20px; cursor: pointer; animation: popIn 0.2s 1; } .form__button:hover { background: #006f9a; } @keyframes popIn { 0% { transform: scale(0); opacity: 0; } 100% { transform: scale(1); opacity: 1; } } </style> </HEAD> <BODY> <div class="form-container"> <h1>Login</h1> <form class="form" action=""> <input class="form__input" type="text" placeholder="Username" /> <input class="form__input" type="password" placeholder="Password" /> <button
March 2, 2023, 4:27 a.m.
A new large language model has been made available since this question was asked.
To generate an updated answer from the new model, click the button below.
Think your answer is better than the AI's? Post it below.
If you want your question answered by an AI, click here.
Post your own comment: