How to change the color of selected text using CSS ?
The colour of selected text can be easily changed by using the CSS | ::selection Selector. In the below code, we have used CSS ::selection on <h1> and <p> element and set its colour as yellow with green background.
Below example implements the above approach:
Example:
<!DOCTYPE html> < html lang = "en" > < head > < title > How to change the color of selected text using CSS? </ title > < style > .geeks h1 { color: green; } h1::selection { background: green; color: yellow; } p::selection { background: green; color: yellow; } </ style > </ head > < body > < div class = "geeks" > < h1 >GeeksforGeeks</ h1 > < p > A Computer Science portal for geeks. It contains well written, well thought and well explained computer science and programming articles, quizzes and many more. </ p > </ div > </ body > </ html > |
Output:
Please Login to comment...