testing/web dev.html at main · OgbuKingsley166/testing · 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
<html>
    <head>
        <title>MY FIRST WEBSITE</title>
      <style>
        body{
            background-color: coral;
            font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
        }
        h1 {
          color:aqua;
          background-color: yellow;
          font-size: 40px;
        }
        p {
          color:blue;
          font-size: 20px;
        }
          button {
            background-color: darkblue;
            color: white;
            font-size: 18px;
            padding: 10px 20px;
        }
        </style>
    </head>
    <body>
        <h1 id="main-heading">Hello, world!</h1>
        <p>This is my first webpage.</p>

        <h2>About me</h2>
        <p>my name is kingsley. i am learning web dev</p>

        <h2>my hobbies</h2>
        <ol>
            <li>coding</li>
            <li>reading</li>
        </ol>
        <button onclick="sayHello()">click me</button>
        <script>
            function sayHello() {
                document.getElementById("main-heading").innerText="you clicked the button!";
                document.getElementById("main-heading").style.color="red";
            }

        </script>
    </body>
</html>