simple-html-css-webiste/index.html at main · foadtkf/simple-html-css-webiste · 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
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Fuad_Assignment1</title>
    <link rel="shortcut icon" href="images/shapes/icon1.jpg" type="image/x-icon">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Lobster&family=Manrope&family=Poppins&family=Roboto:wght@500&family=Yeseva+One&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="style.css">
</head>

<body>
    <section class="sec1">
        <div>
            <h1 class="th1">Stay Focused on <br>
                <span style="color: #ffad5a;">Mission 2022</span>
            </h1>
            <p class="p1">This year, I suppose to learn web programming to be a professional full stack developer. In addition to this, I also enrolled to batch 5 of ProgrammingHero course. So, I suppose to take it to next level. I also learned C/C++, Java, Python,
                Assemblyx84 and some GUI's.</p><br>
            <a class="buttons" href="#">Explore Now</a>
            <p class="p1"><br>Scroll down to know more about me</p>

        </div>

        <img class="pic1" src="images/person/person-4.png">

    </section>
    <br>
    <section class="sec2" style="align-items: center; margin-left: 10%; margin-right: 10%;">
        <h1 class="h1s2"><span style="color: #13103A;">My Mission in</span> <span style="color: #FFAD5A;">2022</span></h1>
        <div class="daddydiv">
            <div class="sons">
                <img style="margin-left: 10%;" src="images/illustrators/illustrator-1.png" alt="">
                <h3 style="margin-left: 10%; ">Mission</h3>
                <p style="margin-left: 10%;">Mission is to be one of the best developers. I've become a bit slower because my sem final is going on. </p>
            </div>
            <div class="sons" style="background: rgba(252, 94, 94, 0.1);">
                <img style="margin-left: 10%;" src="images/illustrators/illustrator-2.png" alt="">
                <h3 style="margin-left: 10%;">Vision</h3>
                <p style="margin-left: 10%;">Build more than 10 full stack web projects in 2022. Hope I'll be able to complete properly.</p>
            </div>
            <div class="sons" style="background: #faf2db;">
                <img style="margin-left: 10%;" src="images/illustrators/illustrator-3.png" alt="">
                <h3 style="margin-left: 10%;">Goals</h3>
                <p style="margin-left: 10%;">My goals are to expertise in web programming. Don't know when this journey will be ended</p>
            </div>
        </div>
    </section>

    <section class="sec3" id="s3" style="margin-right: 10%; margin-top: 5%;">

        <img class="s3pic" src="images/pictures/coding.png" style="padding-left: 12%;">
        <div class="s3wr">
            <h1 class="s3s4head">Develop <br>
                <span>Without limits</span>
            </h1>
            <p class="p1">This is my first project. Hope I'll do something good. My Semester final is near at hand but still I'm doing this assignment. I've started it on 5th January, 11.00pm and still now I'm doing it and now 2.55pm of 6th January! I've taken some
                small breaks though.</p><br>
            <a class="buttons" href="#">Read the Documentation</a>

        </div>

    </section>
    <section class="sec4" id="s4" style="margin-left: 10%;  margin-top: 5%;">


        <div class="s4wr" style="margin-right: 10%; padding-right: 5%;">
            <h1 class="s3s4head">Know our <br> Global Community
            </h1>
            <p class="p1">Global Communities works across interrelated priority areas of focus that cut across our programs and operations and that are what we consider to be key drivers of real and lasting impact.</p><br>
            <a class="buttons" href="#">Read the Documentation</a>

        </div>
        <img class="s4pic" src="images/pictures/project.png">
    </section>
    <section class="sec5" style=" margin-top: 5%; text-align: center;">
        <div>
            <h3 class="sec5h"><span style="color: #fc7e00;">Register</span> for updates</h3>
            <label style="padding-right: 175px;"><b>Email: </b> </label><br><input type="email" placeholder="e.g me@o2.com"><br>
            <label style="padding-right: 175px;"><b>Name: </b></label><br><input type="text" placeholder="F. name"><br><input type="text" placeholder="L. name"><br>
            <label style="padding-right: 135px; margin-bottom: 50px;"><b>Contact no: </b> </label><br><input type="number" placeholder="e.g +880-1212121212"><br>
            <p></p>
            <a class="buttons" href="#">Submit</a>
        </div>

    </section>
    <section style="padding-top: 1%; padding-bottom: 1%; background-image: linear-gradient(#0B0D17,#0B0D17);">
        <center>
            <h2>Mission <span style="color: #FF5959">2022</span></h2>
            <p id="footerp" style="color: white;">Hard work, Perseverance, and Determination for 2022</p>
        </center>
    </section>
</body>

</html>