Skip to content

[css-pseudo-4] Add highlight pseudo for in-page search #3812

Closed
@frivoal

Description

@frivoal

::spelling-error and ::grammar-error allow authors to change the style of two browser-provided highlighting mechanisms.

Using the same system, it would be useful to have a pseudo to change the styling of the highlight shown by browsers when using in-page search. As browsers differentiate between the currently active search result, and other search results, we'd need two pseudos. Straw-man naming proposals:

  • ::active-search
  • ::inactive-search

Safari goes beyond just highlighting the range and also provides additional effects, including bouncy zooming effects when switching which element is focused, or an effect graying out the rest of the page. The proposal here does not try to account for these UI effects, which would continue to exist as desired by the browser.


Note: this is not covered by proposals discussed previously, such as the one from Microsoft, to enable authors to create their own custom stylable ranges via some kind of js api, since the point here is to style a browser-provided range, not an author provided-range.

Metadata

Metadata

Assignees

Labels

Type

No type

Projects

Status

Wednesday afternoon

Status

Unslotted

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions