WebDev-practice-exercises/first_para_colochange.html at main · Rishu-Soni/WebDev-practice-exercises · 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
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Change color of first para</title>
    <style>
        div p:first-child
        {
            color: red;
            background-color: yellow;
            font-size: 20px;
        }
        p
        {
            color: white;
            background-color: blue;
            font-size: 16px;
        }
    </style>
</head>
<body>
    <div>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Officia vel quibusdam facilis unde error adipisci exercitationem. Inventore facere asperiores ab quasi ea modi vitae, nulla aliquam doloribus, sit dolorem molestias eaque odio distinctio architecto atque veritatis nostrum hic esse sapiente? Aliquam eveniet eos sapiente amet?
        </p>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Officia vel quibusdam facilis unde error adipisci exercitationem. Inventore facere asperiores ab quasi ea modi vitae, nulla aliquam doloribus, sit dolorem molestias eaque odio distinctio architecto atque veritatis nostrum hic esse sapiente? Aliquam eveniet eos sapiente amet?
        </p>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Officia vel quibusdam facilis unde error adipisci exercitationem. Inventore facere asperiores ab quasi ea modi vitae, nulla aliquam doloribus, sit dolorem molestias eaque odio distinctio architecto atque veritatis nostrum hic esse sapiente? Aliquam eveniet eos sapiente amet?
        </p>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Officia vel quibusdam facilis unde error adipisci exercitationem. Inventore facere asperiores ab quasi ea modi vitae, nulla aliquam doloribus, sit dolorem molestias eaque odio distinctio architecto atque veritatis nostrum hic esse sapiente? Aliquam eveniet eos sapiente amet?
        </p>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Officia vel quibusdam facilis unde error adipisci exercitationem. Inventore facere asperiores ab quasi ea modi vitae, nulla aliquam doloribus, sit dolorem molestias eaque odio distinctio architecto atque veritatis nostrum hic esse sapiente? Aliquam eveniet eos sapiente amet?
        </p>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Officia vel quibusdam facilis unde error adipisci exercitationem. Inventore facere asperiores ab quasi ea modi vitae, nulla aliquam doloribus, sit dolorem molestias eaque odio distinctio architecto atque veritatis nostrum hic esse sapiente? Aliquam eveniet eos sapiente amet?
        </p>
    </div>
</body>
</html>