+ 1

how to make random change in colors for different inputs

automatic changing of background color after a certain time slot

6th Jul 2016, 4:47 PM

αѕнωιи мσнαи

6 Answers

+ 3

<!DOCTYPE html> <html> <head> <style> input[type=text] { width: 100%; padding: 12px 20px; margin: 8px 0; box-sizing: border-box; background-color: #fff; -webkit-animation: random 5s infinite; animation: random 5s infinite; } @keyframes random { 15% { background-color: red; } 30% { background-color: yellow; } 45% { background-color: green; } 60% { background-color: blue; } 75% { background-color: white; } } /style> </head> <body> <p>Padded text fields:</p> <form> <label for="fname">First Name</label> <input type="text" id="fname" name="fname"> <label for="fname">Last Name</label> <input type="text" id="lname" name="lname"> </form> </body> </html>

7th Jul 2016, 9:36 AM

ZinC

+ 1

plz help if anyone knows. ..

6th Jul 2016, 4:47 PM

αѕнωιи мσнαи

+ 1

@NEquity, that's an animation, not just changing background. Try it. Copy and paste into the Playground. And I should add that you can't make it change color ramdomly through CSS only. You have to use JavaScript for that.

7th Jul 2016, 4:50 PM

ZinC

all of that just to change background??

7th Jul 2016, 9:48 AM

NEquity