html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="style.css">
</head>

<body>
    <header class="header-box">
        <h1>Welcome</h1>
        <p>Hi, my name is John Doe and I am a Web Designer.I designes <br> beautiful and eye catching websites for my
            clients.</p>
        <a href="#cover">Learn more</a>
    </header>
    <section class="wrapper" id="cover">
        <div class="cover-box">
            <div class="content">
                <img src="image/cover.jpg" alt="">
                <div class="cover-text">
                    <div class="cover-head">
                        <h3>FULL STACK WEB DEVELOPER</h3>
                        <p class="sub">I'm available for freelance projects.</p>
                        <hr>
                    </div>
                    <p>Cras aliquet urna ut sapien tincidunt, quis malesuada elit facilisis. Vestibulum sit amet tortor
                        velit. Nam elementum nibh a libero pharetra elementum. Maecenas feugiat ex purus, quis volutpat
                        lacus placerat malesuada. Praesent in sem ex. Morbi mattis sapien pretium tellus venenatis, at.
                    </p>
                    <br>
                    <p>Vivamus fermentum nibh vel pharetra blandit. Cras a purus urna. Sed et libero ex. Orci varius
                        natoque
                        penatibus et magnis dis parturient montes, nascetur ridiculus mus. Suspendisse id hendrerit
                        felis.
                        Nulla viverra tempor dui at congue. Pellentesque quis nulla ornare, congue nisi id, finibus
                        nulla.
                        Aliquam sit amet hendrerit purus. Donec libero massa, posuere fermentum eros sit amet, maximus
                        fringilla augue. Maecenas at rhoncus lorem. Vivamus ultricies consequat est, efficitur convallis
                        libero. Vivamus rutrum semper mauris, vitae consequat eros tempor ac. Pellentesque et ornare
                        sapien
                    </p>
                </div>
            </div>
        </div>
    </section>
    <section class="skills-wrapper">
        <div class="skills">
            <div class="single-skill">
                <h2>HTML</h2>
                <p>Suspendisse mauris. Fusce accumsan mollis eros. Pellentesque a diam sit amet mi ullamcorper vehicula.
                </p>
                <a href="#">Learn more</a>
            </div>
            <div class="single-skill">
                <h2>CSS</h2>
                <p>Suspendisse mauris. Fusce accumsan mollis eros. Pellentesque a diam sit amet mi ullamcorper vehicula.
                </p>
                <a href="#">Learn more</a>
            </div>
            <div class="single-skill">
                <h2>JQUERY</h2>
                <p>Suspendisse mauris. Fusce accumsan mollis eros. Pellentesque a diam sit amet mi ullamcorper vehicula.
                </p>
                <a href="#">Learn more</a>
            </div>
        </div>
    </section>
    <section class="wrapper">
        <div class="posts">
            <div class="single-post">
                <img src="image/blog1.jpg" alt="">
                <div class="post-text">
                    <div class="text-header">
                        <h2>STEPS OF CREATING WEBSITE</h2>
                        <p>Maecenas feugiat ex purus, quis volutpat lacus placerat</p>
                        <div class="divider"></div>
                    </div>
                    <p>Cras aliquet urna ut sapien tincidunt, quis malesuada elit facilisis. Vestibulum sit amet tortor
                        velit. Nam elementum nibh a libero pharetra elementum. Maecenas feugiat ex purus, quis volutpat
                        lacus placerat malesuada. Praesent in sem ex. Morbi mattis sapien pretium tellus venenatis, at
                        egestas urna ornare.</p>
                </div>
            </div>
            <div class="single-post">
                <img src="image/blog2.jpg" alt="">
                <div class="post-text">
                    <div class="text-header">
                        <h2>SKILLS OF WEB DEVELOPERS</h2>
                        <p>Maecenas feugiat ex purus, quis volutpat lacus placerat</p>
                        <div class="divider"></div>
                    </div>
                    <p>Cras aliquet urna ut sapien tincidunt, quis malesuada elit facilisis. Vestibulum sit amet tortor
                        velit. Nam elementum nibh a libero pharetra elementum. Maecenas feugiat ex purus, quis volutpat
                        lacus placerat malesuada. Praesent in sem ex. Morbi mattis sapien pretium tellus venenatis, at
                        egestas urna ornare.</p>
                </div>
            </div>
        </div>
    </section>
    <section class="hire-me">
        <div class="hire-text">
            <h6>ARE YOU READY TO START?</h6>
            <p>Cras aliquet urna ut sapien tincidunt, quis malesuada elit facilisis. Vestibulum sit amet tortor velit.
                Nam elementum nibh a libero pharetra elementum. Maecenas feugiat ex purus, quis volutpat lacus placerat
                malesuada. Praesent in sem ex. Morbi mattis sapien pretium tellus venenatis, at egestas urna ornare.</p>
            <a href="#contact">Hire Me</a>
        </div>
    </section>
    <section class="contact" id="contact">
        <div class="wrapper">
            <div class="contact-content">
                <div class="contact-header">
                    <h2>Get in touch</h2>
                    <div class="divider"></div>
                </div>
                <form action="#">
                    <input type="text" name="" id="" placeholder="Your Name">
                    <input type="email" name="" id="" placeholder="Your Email">
                    <textarea rows="10" placeholder="Your Message"></textarea>
                    <input type="button" class="submit" value="SUBMIT">
                </form>
            </div>
        </div>
    </section>
    <footer>
        <p>All right reserved || Made by @Digitshack</p>
    </footer>
</body>

</html>

Leave a Reply

Your email address will not be published. Required fields are marked *