29 lines
685 B
Markdown
29 lines
685 B
Markdown
|
---
|
||
|
|
title: Selection
|
||
|
|
---
|
||
|
|
## Selection
|
||
|
|
|
||
|
|
The ```::selection``` CSS pseudo-element styles the portion of text a user clicks and drags their cursor over (the highlighted text).
|
||
|
|
|
||
|
|
General Syntax:
|
||
|
|
|
||
|
|
```css
|
||
|
|
::selection
|
||
|
|
```
|
||
|
|
|
||
|
|
## Example
|
||
|
|
|
||
|
|
```css
|
||
|
|
/* "Highlighted text will be #F25757 */
|
||
|
|
::selection {
|
||
|
|
color: #F25757;
|
||
|
|
}
|
||
|
|
```
|
||
|
|
|
||
|
|
The ```::selection``` CSS pseudo-element is useful for styling user selections to match your website/app theme.
|
||
|
|
|
||
|
|
#### More Information:
|
||
|
|
* [MDN Web Docs](https://developer.mozilla.org/en-US/docs/Web/CSS/::after)
|
||
|
|
* [W3 Schools](https://developer.mozilla.org/en-US/docs/Web/CSS/::selection)
|
||
|
|
* [CSS Tricks - ::selection](https://css-tricks.com/almanac/selectors/s/selection/)
|