Sometimes, we want to disable form fields using CSS.
In this article, we’ll look at how to disable form fields using CSS.
How to disable form fields using CSS?
To disable form fields using CSS, we set the pointer-events style.
For instance, we write
<input type="text" name="username" value="admin" tabindex="-1" />
to add an input.
Then we write
input[name="username"] {
pointer-events: none;
}
to select the input with the name attribute set to username.
And set set its style to pointer-events: none; to disable it.
We also set its tabindex to -1 so we can’t focus on it.
Conclusion
To disable form fields using CSS, we set the pointer-events style.
