HTML-CSS-Homework/week1/3-website/index.html at 3275e7cbe0da72b044734dfe5c60f339b5c39c77 · CodeYourFuture/HTML-CSS-Homework · 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
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1, shrink-to-fit=no"
    />
    <title>My Blog</title>
    <link
      href="//fonts.googleapis.com/css?family=Roboto:400,500,300"
      rel="stylesheet"
      type="text/css"
    />
    <link rel="stylesheet" href="css/style.css" />
    <link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
  </head>
  <body>
    <div class="wrapper">
      <header>
        <div id="logo">
          <h3>Ann's Blog</h3>
          <h6>
            This is My Blog here you'll find about me , my hobbies and my food
            and travel diary
          </h6>
        </div>
        <nav>
          <a href="#about_me">About Me</a> | <a href="#hobbies">Hobbies</a> |
          <a href="#food">Food and Travel Diary</a> |
        </nav>
      </header>
      <div id="big-image">
        <img
          src="img/minimal-imac-pro-desk-mockup.jpg"
          width="100%"
          alt="awesome graphics"
        />
      </div>
      <main>
        <section>
          <article class="articles">
            <a id="about_me"><h3>About Me</h3></a>
            <p>
              It is a long established fact that a reader will be distracted by
              the readable content of a page when looking at its layout. The
              point of using Lorem Ipsum is that it has a more-or-less normal
              distribution of letters, as opposed to using 'Content here,
              content here', making it look like readable English. Many desktop
              publishing packages and web page editors now use Lorem Ipsum as
              their default model text, and a search for 'lorem ipsum' will
              uncover many web sites still in their infancy. Various versions
              have evolved over the years, sometimes by accident, sometimes on
              purpose (injected humour and the like).
            </p>
            <a href="" target="_blank">Read more About Me</a>
          </article>

          <article>
            <a id="hobbies"> <h3>My Hobbies</h3> </a>
            <p>
              It is a long established fact that a reader will be distracted by
              the readable content of a page when looking at its layout. The
              point of using Lorem Ipsum is that it has a more-or-less normal
              distribution of letters, as opposed to using 'Content here,
              content here', making it look like readable English. Many desktop
              publishing packages and web page editors now use Lorem Ipsum as
              their default model text, and a search for 'lorem ipsum' will
              uncover many web sites still in their infancy. Various versions
              have evolved over the years, sometimes by accident, sometimes on
              purpose (injected humour and the like).
            </p>
            <a href="" target="_blank">Read more of my hobbies</a>
          </article>
          <article>
            <a id="food">
              <h3>Food and Travel</h3>
            </a>
            <p>
              It is a long established fact that a reader will be distracted by
              the readable content of a page when looking at its layout. The
              point of using Lorem Ipsum is that it has a more-or-less normal
              distribution of letters, as opposed to using 'Content here,
              content here', making it look like readable English. Many desktop
              publishing packages and web page editors now use Lorem Ipsum as
              their default model text, and a search for 'lorem ipsum' will
              uncover many web sites still in their infancy. Various versions
              have evolved over the years, sometimes by accident, sometimes on
              purpose (injected humour and the like).
            </p>
            <a href="" target="_blank">Food and travel Diaries in detail</a>
          </article>
        </section>
        <aside>
          <h3>Useful Links</h3>
          <ul>
            <li><a href="">Ann</a></li>

            <li>
              <a target="_blank" href="http://freecodecamp.org">
                Free Code Camp</a
              >
            </li>
          </ul>
        </aside>
      </main>
      <footer>&copy Ann</footer>
    </div>
  </body>
</html>