Scribd Logo
Upload

Welcome to Scribd!

  • MWJ

    Uploaded by

    Khush Saraswat
    5 views4 pages

    Copyright

    © © All Rights Reserved

    Available Formats

    TXT, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as txt, pdf, or txt
    5 views4 pages

    MWJ

    Uploaded by

    Khush Saraswat

    Copyright:

    © All Rights Reserved
    Download as TXT, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as txt, pdf, or txt
    of 4

    <!

    DOCTYPE html>
    <html>
    <head>
    <title>Cloth Selling Website</title>
    </head>
    <body>
    <header>
    <h1>Welcome to our Cloth Selling Website</h1>
    <style>
    /* CSS Code */
    body {
    background-color: #f2f2f2;
    font-family: Arial, sans-serif;
    font-size: 16px;
    line-height: 1.5;
    margin: 0;
    padding: 0;
    }

    header {
    background-color: #333;
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
    }

    h1 {
    margin: 0;
    }

    nav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    }

    nav li {
    margin: 0 1rem;
    }

    nav a {
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    font-size: 1.2rem;
    text-transform: uppercase;
    }

    main {
    max-width: 1200px;
    margin: 0 auto;
    padding: 2rem;
    }

    section {
    margin-bottom: 2rem;
    }

    h2 {
    font-size: 2rem;
    margin-bottom: 1rem;
    }

    ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    }

    li {
    flex-basis: 45%;
    margin: 1rem;
    border: 1px solid #ddd;
    padding: 1rem;
    }

    img {
    max-width: 100%;
    height: auto;
    margin-bottom: 1rem;
    }

    button {
    background-color: #333;
    color: #fff;
    padding: 0.5rem 1rem;
    border: none;
    cursor: pointer;
    font-size: 1rem;
    text-transform: uppercase;
    }

    button:hover {
    background-color: #666;
    }

    footer {
    background-color: #333;
    color: #fff;
    padding: 1rem;
    text-align: center;
    }
    </style>
    </head>
    <body>
    <header>
    <h1>Welcome to our Cloth Selling Website</h1>
    <nav>
    <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Products</a></li>
    <li><a href="#">Contact Us</a></li>
    </ul>
    </nav>
    </header>

    <main>
    <section>
    <h2>New Arrivals</h2>
    <ul>
    <li>
    <h3>Product 1</h3>
    <img src="product1.jpg" alt="Product 1">
    <p>Description of product 1.</p>
    <button>Add to Cart</button>
    </li>
    <li>
    <h3>Product 2</h3>
    <img src="product2.jpg" alt="Product 2">
    <p>Description of product 2.</p>
    <button>Add to Cart</button>
    </li>
    </ul>
    </section>

    <section>
    <h2
    <nav>
    <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Products</a></li>
    <li><a href="#">Contact Us</a></li>
    </ul>
    </nav>
    </header>

    <main>
    <section>
    <h2>New Arrivals</h2>
    <ul>
    <li>
    <h3>Product 1</h3>
    <img src="product1.jpg" alt="Product 1">
    <p>Description of product 1.</p>
    <button>Add to Cart</button>
    </li>
    <li>
    <h3>Product 2</h3>
    <img src="product2.jpg" alt="Product 2">
    <p>Description of product 2.</p>
    <button>Add to Cart</button>
    </li>
    </ul>
    </section>

    <section>
    <h2>Best Sellers</h2>
    <ul>
    <li>
    <h3>Product 3</h3>
    <img src="product3.jpg" alt="Product 3">
    <p>Description of product 3.</p>
    <button>Add to Cart</button>
    </li>
    <li>
    <h3>Product 4</h3>
    <img src="product4.jpg" alt="Product 4">
    <p>Description of product 4.</p>
    <button>Add to Cart</button>
    </li>
    </ul>
    </section>
    </main>

    <footer>
    <p>&copy; 2023 Cloth Selling Website. All Rights Reserved.</p>
    </footer>
    </body>
    </html>

    You might also like