Scribd Logo
Upload

Welcome to Scribd!

  • Website - Layout

    Uploaded by

    Punith Kumar
    13 views9 pages

    Original Title

    Website - layout

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, 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 DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    13 views9 pages

    Website - Layout

    Uploaded by

    Punith Kumar

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 9

    SOURCE CODE

    <!DOCTYPE html>

    <html>

    <head>

    <meta charset="UTF-8">

    <title>index.html</title>

    <link href="CSS/style.css" rel="stylesheet" type="text/css">

    </head>

    <body>

    <div class="wrapper">

    <div class="top">

    <h1>ALL YOU NEED IS LOVE & LEATHER</h1>

    <h2>Owned by V!NN!E</h2>

    <!--Background set in CSS-->

    </div><!-- end of top-->

    <div class="menu">

    <h1>LEATHER&LEATHER</h1>

    <ul id="nav">

    <li><a href="Page 1.html"> Goods</a></li>

    <li><a href="Page 2.html"> Craft your Leather</a></li>

    <li><a href=""> Contact Us </a></li>

    </ul>

    </div>

    <!-- end of menu -->

    <div class="main">
    <p> Welcome to LEATHER & LEATHER </p>

    <p> Shop here to find the best handmade crafts</p>

    <img src="Images/p6.webp"width="150" height="150">

    <img src="Images/p5.webp"width="150" height="150">

    <img src="Images/p4.webp"width="150" height="150">

    <img src="Images/p3.webp"width="150" height="150">

    <img src="Images/p2.webp"width="150" height="150">

    <img src="Images/p1.webp"width="150" height="150"> </div>

    <!--close main-->

    <div class="footer">

    <ul id="footer">

    <li> <img src="Images/Insta.png"width="35" height="30">

    <img src="Images/twitter.png"width="30" height="30" /> </li>

    <li> Email Address</li>

    <li> Address </li>

    <li> Contact Number</li>

    <li> About</li>

    </ul>

    </div>

    <!--end of footer-->
    </div>

    </body>

    </html>

    STYLE.CSS
    @charset "utf-8";

    /* CSS Document */

    body

    .wrapper {

    margin:0 auto;

    background-color:#644017;

    .top {

    background-color:white;

    padding-bottom:1em;

    text-align:center;

    font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";

    font-size:9px;

    .menu {

    background-color:aliceblue;

    border-bottom-width:40px;

    border-bottom-color:#644017;

    border-bottom-style: solid;

    position:static;

    top:-15px;
    text-align:center;

    font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";

    font-size:18px;

    padding-left:5em;

    padding-right:1em;

    overflow:hidden;

    .menu h1 {

    float:left;

    color:saddlebrown;

    font-family:andalus;

    font-size:40px;

    .main {

    width:80%;

    margin:0 auto;

    background-color:aliceblue;

    text-align:center;

    font-family:Constantia, "Lucida Bright", "DejaVu Serif", Georgia, "serif";

    font-size:24px;

    padding-top:1px;

    .footer {

    text-align:centre;
    background-color:aliceblue;

    color:black;

    font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";

    margin-bottom:-3em;

    font-size: 17px;

    .a{

    margin:0 auto;

    background-color:#644017;

    .b{

    text-align:center;

    background-color:white;

    color:black;

    font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";

    margin-bottom:1em;

    font-size: 10px;

    .d{

    margin:0 auto;

    background-color:#644017;

    .c{

    text-align:center;

    background-color:aliceblue;

    color:black;

    font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
    margin-bottom:1em;

    font-size: 20px;

    .e{

    text-align:center;

    background-color:white;

    color:black;

    font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";

    margin-bottom:1em;

    font-size: 10px;

    .f{

    text-align:center;

    background-color:aliceblue;

    color:black;

    font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";

    margin-bottom:1em;

    font-size: 20px;

    .g{

    margin:0 auto;

    background-color:#644017

    .h{

    text-align:center;

    background-color:aliceblue;

    color:black;

    font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";
    margin-bottom:1em;

    font-size: 9px;

    .g{

    text-align:center;

    font-size: 30px;

    .h{

    margin:0 auto;

    background-color:#644017

    .i{

    text-align:center;

    background-color:aliceblue;

    color:black;

    font-family:Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", "serif";

    margin-bottom:1em;

    font-size: 9px;

    .j{

    font-size: 20px;

    .k {

    text-align:center;

    font-size: 30px;

    #footer li {
    display:inline-block;

    padding-right:4em;

    vertical-align:middle;

    margin-top:-30px;

    #nav {

    padding-top:15px;

    #nav a {

    text-decoration:none;

    #nav a:link {

    color:black;

    #nav a:visited {

    color:black;

    #nav a:hover {

    color:black;

    img {
    margin:42px;

    #nav ul {

    display:inline-block;

    #nav li {

    display:inline-block;

    margin-right:4.5em;

    padding-right:2.5em;

    4591 1503 5901 7936

    11/23

    736 391

    You might also like