June 11, 2020
How to Change Selected Text Background Color in CSS
HTML:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="style.css"> </head> <body> <h1>This is H1 Element</h1> <p>This is paragraph Element</p> <div>This is DIV Element</div> </body> </html> |
CSS:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 |
body { display: flex; flex-direction: column; align-items: center; } h1, p, div { border: 1px solid black; padding: 10px; } /* p::selection { background-color: black; color: #fff; } div::selection { background-color: yellow; color: red; } */ ::selection { background-color: yellow; color: red; } |