Skip to main content

Netflix Clone : Html


 


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

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=0">
    <title>Netflix Clone</title>
    <link rel="stylesheet" href="style.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css"
        integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA=="
        crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>

<body>
    <div class="main">
        <Nav>
            <span><img class="navlogo" src="Image/Netflix_Brand_logo.png" alt="Netflix Logo"></span>
            <div>
                <button class="btn sn">English</button>
                <button class="btn btn-red-sm">Sign In</button>
            </div>
        </Nav>
        <div class="box">
        </div>
        <div class="hero">
            <span>Laughter. Tears. Thrills. Find it all on Netflix.</span>
            <span>Endless entertainment starts at just ₹ 149. Cancel anytime.</span>
            <span>Ready to watch? Enter your email to create or restart your membership.</span>
            <div class="hero_in">
                <input type="text" placeholder="Email Address">
                <button class="btn btn-red">Get Started &gt;</button>
            </div>
        </div>
    </div>
    <div class="separetion"></div>
    <section class="First one">
        <div>
            <span>Enjoy on your TV</span>
            <span>Watch on smart TVs, PlayStation, Xbox, Chromecast, Apple TV, Blu-ray players and more.</span>
        </div>
        <div class="secimg">
            <img src="https://assets.nflxext.com/ffe/siteui/acquisition/ourStory/fuji/desktop/tv.png" alt="">
            <video src="https://assets.nflxext.com/ffe/siteui/acquisition/ourStory/fuji/desktop/video-tv-in-0819.m4v"
                autoplay loop muted></video>
        </div>
    </section>
    <div class="separetion"></div>

    <section class="First Second">
        <div class="secimg">
            <img src="https://assets.nflxext.com/ffe/siteui/acquisition/ourStory/fuji/desktop/mobile-0819.jpg" alt="">
        </div>
        <div>
            <span>Download your shows to watch offline</span>
            <span>Save your favourites easily and always have something to watch.</span>
        </div>
    </section>
    <div class="separetion"></div>
    <section class="First Third">
        <div>
            <span>Watch everywhere</span>
            <span>Stream unlimited movies and TV shows on your phone, tablet, laptop, and TV.</span>
        </div>
        <div class="secimg">
            <img src="https://assets.nflxext.com/ffe/siteui/acquisition/ourStory/fuji/desktop/device-pile-in.png"
                alt="">
            <video src="https://assets.nflxext.com/ffe/siteui/acquisition/ourStory/fuji/desktop/video-devices-in.m4v"
                autoplay loop muted></video>
        </div>
    </section>
    <div class="separetion"></div>
    <section class="First four">
        <div class="secimg">
            <img src="https://occ-0-4995-2164.1.nflxso.net/dnm/api/v6/19OhWN2dO19C9txTON9tvTFtefw/AAAABVr8nYuAg0xDpXDv0VI9HUoH7r2aGp4TKRCsKNQrMwxzTtr-NlwOHeS8bCI2oeZddmu3nMYr3j9MjYhHyjBASb1FaOGYZNYvPBCL.png?r=54d"
                alt="">
        </div>
        <div>
            <span>Create profiles for kids</span>
            <span>Send children on adventures with their favourite characters in a space made just for them—free with
                your membership.</span>
        </div>
    </section>
    <section class="FAQ">
        <h2>Frequently Asked Questions</h2>
        <div class="faQboxs">
            <span>What is Netflix ?</span>
            <i class="fa-solid fa-plus"></i>
        </div>

        <div class="faQboxs">
            <span>How much does Netflix cost ?</span>
            <i class="fa-solid fa-plus"></i>
        </div>

        <div class="faQboxs">
            <span>Where can I watch ?</span>
            <i class="fa-solid fa-plus"></i>
        </div>

        <div class="faQboxs">
            <span>How do I cancel ?</span>
            <i class="fa-solid fa-plus"></i>
        </div>

        <div class="faQboxs">
            <span>What can I watch on Netflix ?</span>
            <i class="fa-solid fa-plus"></i>
        </div>

        <div class="faQboxs">
            <span>Is Netflix Good for Kids ?</span>
            <i class="fa-solid fa-plus"></i>
        </div>
    </section>
    <div class="separetion"></div>
    <footer>
        <div class="span">
            Questions? Call 000-800-919-1694
        </div>
        <div class="footer">
            <div class="footer-itrms">
                <a href="faq">FAQ</a>
                <a href="#">Investor Relations</a>
                <a href="#">Privacy</a>
                <a href="#">Speed Test</a>
            </div>
            <div class="footer-itrms">
                <a href="faq">FAQ</a>
                <a href="#">Investor Relations</a>
                <a href="#">Privacy</a>
                <a href="#">Speed Test</a>
            </div>
            <div class="footer-itrms">
                <a href="faq">FAQ</a>
                <a href="#">Investor Relations</a>
                <a href="#">Privacy</a>
                <a href="#">Speed Test</a>
            </div>
            <div class="footer-itrms">
                <a href="faq">FAQ</a>
                <a href="#">Investor Relations</a>
                <a href="#">Privacy</a>
                <a href="#">Speed Test</a>
            </div>
        </div>
        <div class="span">
            Netflix India
        </div>
    </footer>
</body>

</html>

Comments

Popular posts from this blog

Grocery kart : Html and CSS

  HTML ==   < footer class = "footer" >     < div class = "container" >       < div class = "row" >         < div class = "footer-col" >           < h4 > company </ h4 >           < ul >             < li >< a href = "#" > about us </ a ></ li >             < li >< a href = "#" > our services </ a ></ li >             < li >< a href = "#" > privacy policy </ a ></ li >             < li >< a href = "#" > affiliate program </ a ></ li >           </ ul >         </ div >         < div class = "footer-col" >           ...