lab01b/index.html at main · Bashar-Syouri/lab01b · 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
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Welcome to 201 level</title>
    <style>
        #firstItem {
            background-color: rgb(151, 190,235);

        }
        #firstItem a {
            text-decoration: none;
            color: rgb(27, 131, 58);
        }

       .listItem a {
                background-color: rgba(255, 0, 221, 0.815);
                display: inline;
            }

            #p1 {

                background-color: rgb(172, 113, 139);
            }

            #p2 {
                background-color: rgb(151, 190,235);
            }

            #p3 {
                background-color: rgb(45, 79, 110);
            }

            #p4 {
                background-color: rgb(133, 32, 108);
            }

        h1 {
            text-align:center;

            font-background-color: red;


            background-color:rgb(46, 121, 156);


           }

        nav ul li a {
            display: inline;
            text-align: center;

        }

        body {
            text-align: center;
        }

      body header nav ul li {
          background-color: rgba(0, 225, 255, 0.815);


    </style>
</head>

<body>
    <header>

        <nav>
            <ul>
                <li id="firstItem"><a herf="#">Home</a></li>
                <li class="listItems"><a href="#">About</a></li>
                <li class="listItems"><a href="#">Contact</a></li>
            </ul>
        </nav>
    </header>

    <main>
        <h1>calss1 lab</h1>
        <article>
            <p id="p1" style="color: rgba(54, 44, 194, 0.753);">"What is your name please?</p>
            <p id="p2" style="color: rgb(7, 14, 70);">Where are you from please? ></p>
            <p id="p3" style="color: rgb(29, 2, 4);">How old are you please?</p>
            <p id="p4" style="color: aquamarine;">What is the time now please?</p>

            <P style="color: red;">Here we will learn about HTML, CSS and JAVASCRIPT</P>
        </article>

        <img src="https://3.bp.blogspot.com/-7pXla4gYcSU/XB-aQElY_zI/AAAAAAAAHTA/soP-84BDatwdPyeo3jrwtQxQAvzbQIbUgCLcBGAs/s1600/js_css_html.png">
    </main>
    <footer>
        &copy; Bashar-Syouri 2021
    </footer>


    <script src="app.js"></script>
</body>
</html>