HTML-CSS-Coursework-Week3/index.html at 0f1cc2da3fc892bd4ae20f483721230b9667ec9a · CodeYourFuture/HTML-CSS-Coursework-Week3 · 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
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Responsive Cake webpage</title>
    <!-- Add a link to your css file here -->
    <link rel="stylesheet" href="index.css">
</head>

<body>
    <!-- Add your markup here -->
    <div class="container">
    <header class="header">

        <img src="image/deva-williamson-S2jw81lfrG0-unsplash.jpg" alt="cake">

        <p class="par">
            The best cakes in town deliverd to your door
        </p>

    </header>
    <nav class="nav">
        <ul class="ul-nav">
            <li>
                <a href="#" class="n-link">HOME</a>
            </li>
            <li>
                <a href="#" class="n-link">CAKES</a>
            </li>
            <li>
                <a href="#" class="n-link">ORDERIN</a>
            </li>
            <li>
                <a href="#" class="n-link">LESSONS</a>
            </li>
            <li>
                <a href="#" class="n-link">ABOUT</a>
            </li>
        </ul>
    </nav>
    <main class="main">
        <div class="main-1">
                <article class="article-1">
                    <img src="image/american-heritage-chocolate-vdx5hPQhXFk-unsplash.jpg" alt="cake-image" class="cake-1">
                </article>
                <section class="section-1"> welcome</section>
                <section class="section-2">
                    We have a wide variety of cakes organised into collections.
                    Many of our cakes can be purchased online
                    and either delivered in the Edinburgh and
                    Glasgow regions of Scotland or collected from our cake shops.
                    Make your selection here!
                </section>
        </div>
        <div class="main-2">
            <article class="article-a">
                <img src="image/alex-lvrs-aX_ljOOyWJY-unsplash.jpg" alt="cake-image" class="cake-a">
            </article>
            <article class="article-b">
                <img src="image/heather-barnes-_TN1m5R1pFI-unsplash.jpg" alt="cake-image" class="cake-b">
            </article>
            <article class="article-c">
                <img src="image/henry-be-_y5CCcYWTjU-unsplash.jpg" alt="cake-image" class="cake-c">
            </article>
            <article class="article-d">
                <img src="image/jacob-thomas-6jHpcBPw7i8-unsplash.jpg" alt="cake-image" class="cake-d">
            </article>
        </div>
    </main>
    <footer class="footer">
        <section class="section-a"><img src="icon/pngwing.com (1).png" alt="instagram" class="icon-a"></section>
        <section class="section-b"><img src="icon/dT76Ga98c.png" alt="facebook" class="icon-b"></section>
        <section class="section-c"><img src="icon/yio6XBkeT.png" alt="twitter" class="icon-c"></section>
        <section class="section-d"> info@123456.co.uk</section>
    </footer>
</div>
</body>

</html>