WEBLEB
Home
Editor
Accedi
Pro
Italiano
English
Français
Español
Português
Deutsch
Italiano
हिंदी
Input HTML animato
1575
securearray494
Apri nell'Editor
Pubblica il Tuo Codice
Consigliato
22 August 2025
Commento segnaposto codice HTML
12 July 2025
Modello HTML/CS per lettore musicale simile a Spotify
23 August 2025
Modello HTML/CSS/JS per modulo di accesso e registrazione
HTML
Copy
<div class="input-group"> <input required="" type="text" name="text" autocomplete="off" class="input"> <label class="user-label">First Name</label> </div>
CSS
Copy
body{ margin: 0; padding: 0; min-height: 100vh; display: flex; align-items: center; justify-content: center; background: #0b1522; } .input-group { position: relative; } .input { border: solid 1.5px #9e9e9e; border-radius: 1rem; background: none; padding: 1rem; font-size: 1rem; color: #f5f5f5; transition: border 150ms cubic-bezier(0.4,0,0.2,1); } .user-label { position: absolute; left: 15px; color: #e8e8e8; pointer-events: none; transform: translateY(1rem); transition: 150ms cubic-bezier(0.4,0,0.2,1); } .input:focus, input:valid { outline: none; border: 1.5px solid #1a73e8; } .input:focus ~ label, input:valid ~ label { transform: translateY(-50%) scale(0.8); background-color: #212121; padding: 0 .2em; color: #2196f3; }
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */
