Portfolio-s/index.html at main · sufe01/Portfolio-s · 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
101
102
103
104
105
106
107
108
109
110
<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">
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
    <title>Portfolio Website</title>
    <link rel="stylesheet" href="Portfolio_1.css">
</head>
<body>
    <!-----------------------------Main --------------------------->
   <div id="hero">
    <nav>
        <h2 class="logo">Portfo<span>lio</span></h2>
        <ul>
            <li><a href="Portfolio_4.html">Home</a></li>
            <li><a href="#about">About Me</a></li>
            <li><a href="#service">Services</a></li>
            <li><a href="portfolio_3.html">Skills</a></li>
            <li><a href="#contact-me">cotact Me</a></li>

        </ul>
        <a href="Portfolio_2.html" class="btn">Subscribe</a>
    </nav>
    <div class="content">
        <h4>Hello, My Name Is</h4>
        <h1>SUFE <span>MEO</span></h1>
        <h3>I'am a<span> Web Developer</span><br>& Designer</h3>
        <div class="newslatter">
        <form>
            <input type="email" placeholder="Enter Your Email">
            <input type="submit" name="submit" value="Lets Start">
        </form>
       </div>
    </div>
   </div>
   <!---------------------------------about me------------------------------->
<section id="about">
    <div class="main">
        <img src="images/7.png">
        <div class="about-text">
            <h2>About Me</h2>
            <h5>Developer <span>& Designer</span></h5>
            <p>I am a front-end web developr. i can provide clean code and pixel perfect design. I also make the websitesmore & More
               interactive. A responsive design makes your website accesiblle to all users, regardless of thier devices.
               Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
            </p>
            <button type="button">Let's Talk</button>
        </div>
    </div>
</section>
<!-- -------------------------------services----------------------------->
<div id="service">
    <div class="tittle">
        <h2>Our Services</h2>
    </div>
    <div class="box">
        <div class="card">
            <i class="fa fa-bars"></i>
            <h5>Web Development</h5>
            <div class="pra">
                <p>Every Website should be built with two primary goals: firstly, it need to work across all devices.
                   Secondly, it needs to be fast as possible.</p>
                   <p style="text-align:center">
                <a href="" class="button">Read More</a></p>
            </div>
        </div>

        <div class="card">
            <i class="fa fa-user"></i>
            <h5>Web Development</h5>
            <div class="pra">
                <p>Every Website should be built with two primary goals: firstly, it need to work across all devices.
                   Secondly, it needs to be fast as possible.</p>
                   <p style="text-align:center">
                <a href="" class="button">Read More</a></p>
            </div>
        </div>

        <div class="card">
            <i class="fa fa-bell"></i>
            <h5>Web Development</h5>
            <div class="pra">
                <p>Every Website should be built with two primary goals: firstly, it need to work across all devices.
                   Secondly, it needs to be fast as possible.</p>
                   <p style="text-align:center">
                <a href="" class="button">Read More</a></p>
            </div>
        </div>
    </div>
</div>
<!------------------------------------contact me-------------------------------------->
<div id="contact-me">
    <p>Let Me Get You A Beautiful Website</p>
    <a href="" class="button-two">Hire Me</a>
</div>
<!-- ---------------------------------------footer--------------------------------- -->
<footer>
    <p>SUFE MEO</p>
    <p>For more HTML & CSS designing contact me and make a beautiful  website design.</p>
    <div class="social">
        <a href="https://web.facebook.com/"><i class="fa fa-facebook"></i></a>
        <a href="https://www.instagram.com/"><i class="fa fa-instagram"></i></a>
        <a href="https://www.linkedin.com/"><i class="fa fa-linkedin"></i></a>
    </div>
    <!-- --------------------Copyright------------------------- -->
    <p class="end">&copy;Copyright By | Sufe Meo</p>
</footer>
</body>
</html>