CSS :defined Pseudo-class
Example
Use of the :defined pseudo-class:
custom-element:not(:defined) {
border-color: grey;
color:
grey;
}
custom-element:defined {
background-color: salmon;
border-color: maroon;
color: black;
}
/* show loading
message */
custom-element:not(:defined)::before {
content:
"Loading...";
position: absolute;
inset: 0 0 0 0;
align-content: center;
text-align: center;
font-size:
25px;
background-color: white;
}
/* remove the loading
message */
custom-element:defined::before {
content: "";
}
Try it Yourself »
Definition and Usage
The CSS :defined pseudo-class matches any
element that has been defined.
This pseudo-class can be used on standard elements and custom elements that have been successfully defined.
| Version: | CSS4 |
|---|
Browser Support
The numbers in the table specifies the first browser version that fully supports the pseudo-class.
| Pseudo-class | |||||
|---|---|---|---|---|---|
| :defined | 54 | 79 | 63 | 10 | 41 |
CSS Syntax
:defined {
css declarations;
}
