CSS ::highlight() Pseudo-element
Example
Style four custom highlights:
::highlight(mycolor-1) {
color: red;
}
::highlight(mycolor-2) {
color: green;
}
::highlight(mycolor-3) {
color: blue;
}
::highlight(mycolor-4) {
color: salmon;
}
Try it Yourself »
Definition and Usage
The ::highlight() pseudo-element is used to
style a custom highlight.
A custom highlight is a collection of Range objects and is registered on a webpage using the HighlightRegistry.
Note: The following properties can be used with ::highlight():
- color
- background-color
- text-decoration
- text-shadow
| Version: | CSS Custom Highlight API Module Level 1 |
|---|
Browser Support
The numbers in the table specifies the first browser version that fully supports the pseudo-element.
| Pseudo-element | |||||
|---|---|---|---|---|---|
| ::highlight() | 105 | 105 | No | 17.2 | 91 |
CSS Syntax
::highlight(custom-highlight-name) {
css declarations;
}
Related Pages
CSS tutorial: CSS Pseudo-elements
