front-end-work/index.html at main · tashtech2024/front-end-work · 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
<!DOCTYPE html>
<html lang="en">
  <head>
    <title> CSS Inline Style </title>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <h1>Hello World</h1>

  </header>

    </header>

    <main>
      <h1>External Styles</h1>


      <img
        src=" https://m.media-amazon.com/images/I/71c88Xuk0CL.__AC_SX300_SY300_QL70_FMwebp_.jpg"
        alt="Gold medal"
        width="300"
        height="200"
      />

      <p id="intro">Allow you to define styles for the whole website.</p>
      <p class="colorful">This has a style applied via a class.</p>

      <!-- Section 1 -->

      <section>
        <h1>Changes</h1>
        <h2>Different ways to apply CSS styles</h2>
        <p>1) Inline style</p>
        <p>2) Internal style sheet</p>
        <p>3) External style sheet</p>
      </section>

      <section>
        <h2>
          That's all for now!
          <img
            src="https://media3.giphy.com/media/357eCi0n2r19miE7qy/200w.gif?cid=6c09b952vfg2vm089nau11n2i993ketdweafinq7a904jgn5&ep=v1_gifs_search&rid=200w.gif&ct=g"
            alt="girl waving"
            width="200"
            height="100"
          />
        </h2>
      </section>
    </main>

    <link rel="stylesheet" href="../front-end-work/styles/styles.css" />
  </body>