From the course: HTML and CSS: Creating Forms

Unlock this course with a free trial

Join today to access over 25,500 courses taught by industry experts.

Styling pseudo-classes

Styling pseudo-classes

- [Instructor] A pseudo-class is a keyword that specifies the state of an element. You can use it to apply styles to an element with that state. There are several pseudo-classes you can use when styling forms. The first pseudo-classes we'll look at are enabled and disabled. Form fields are enabled by default, but you can add a disabled attribute to any field if you don't want the user to enter anything in it. I'm going to go into the HTML, and I have disabled as an attribute here in the input on line 12 for the first name field. Going into the browser, you can see that that Name field has a slightly lighter gray border, but it's pretty difficult to see the difference between that and the email field below it. If you try to click into the Name field here, nothing happens, you don't get a cursor. But other than the slight distinction of the border color, it's not really obvious so it may be confusing to users. So looking at the CSS, we're going to add a style to that disabled field to…

Contents