Menu
Above you have a button in 3 states, normal, hover, and then what is the third state called? What would need to put into my CSS to style this?
The button seems to be in this state after a right click too.
Really simple probably, I know, but I can't figure it out.
594
In the example below, we have <input> elements with type="button" and type="submit", which we style with CSS properties. To style them, we use the background-color and color properties, set the border and text-decoration properties to "none". Then, we add padding and margin, after which we specify the cursor as "pointer".
When button receives focus, the browser provides an outline to the button. To remove the outline, set the outline to none on the :focus pseudo-class Finally, there is an :active pseudo-class for the button. This helps to style the button when the button is pressed or clicked.
The class="button" attribute will be used to style the button in a separate CSS file. The value button could be any other name you choose. For example you could have used class="btn".
Styled input buttons. In the next example, we have a <form> element within which we add <div> elements each containing a <label> and <input>. Then, we add another <input> with type="submit" and style it.
The state you are looking for is the focus state
There are actually 4 states in the GIF you presented
Cannot replicate your gif exactly, but here is a JSFIDDLE demonstrating these 4 states.
112
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
