html-css/1-100 HTML CSS JS Animation effects/13 selection pseudo elements.html at main · dm-thedeveloper/html-css · GitHub

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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<style>
    /* boilerplate */
    * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }

    html, body {
      font-family: sans-serif;
      overflow-x: hidden;
      background-color: gray;
      padding: 50px;
      color: white;
    }

    body {
    min-height: 100vh;
    height:auto ;
    width : 100%
    }

::selection{
    background: white;
    color: black;
}
h1::selection{
    background: red;
    color: yellow;
    scale: 2;
}

</style>
<body>
    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nostrum, commodi sunt, accusantium quibusdam eum laudantium eligendi voluptates rem laborum cupiditate ut voluptatem pariatur voluptate expedita distinctio rerum beatae reprehenderit fugiat?
    Minima, nesciunt beatae adipisci porro eveniet sunt eaque est reiciendis! Placeat error deserunt soluta sit illo odio dolor maiores? Veritatis, saepe? Aperiam esse ex placeat doloremque quidem, ipsa ipsum quisquam?
    Libero sapiente in pariatur nesciunt doloremque atque modi sint, ipsum, esse, porro eos blanditiis? Cupiditate neque beatae dicta rerum nulla totam officia quos quia autem a. Officia expedita quis dolores!</p>
<h1>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Iste culpa a quisquam alias in deserunt ipsam suscipit cum quam. Adipisci repudiandae, mollitia ut aliquam nobis vitae ratione autem deserunt libero!</h1>

</body>
</html>