practical_projects/4.semantic.html at main · Amytrainer/practical_projects · 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
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Semantic</title>
    <link rel="stylesheet" href="style.css" />
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/regular.min.css"
    />
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/svg-with-js.min.css"
    />
  </head>
  <!-- <style>
    *{
       background-color: lightcoral;
       font-size: 40%;
    }
    .section1 {
      background-color: aquamarine;
    }
  </style> -->
  <body>
    <!-- Understand the problem -->
    <!-- 3 types CSS

1.inline CSS
2.Embedded or internal CSS
3.External CSS  -->

    <section class="section1">
      <h1>WWF</h1>
      <p>
        The World Wide Fund for Nature (WWF) is an international organization
        working on issues regarding the conservation, research and restoration
        of the environment, formerly named the World Wildlife Fund. WWF was
        founded in 1961.
      </p>
    </section>
    <i class="fa fa-spinner fa-spin fa-3x fa-fw"></i>
    <span class="sr-only">Loading...</span>
    <section>
      <h1>WWF's Panda symbol</h1>
      <p>
        The Panda has become the symbol of WWF. The well-known panda logo of WWF
        originated from a panda named Chi Chi that was transferred from the
        Beijing Zoo to the London Zoo in the same year of the establishment of
        WWF.
      </p>
    </section>
  </body>
</html>