CSS-Layout/fenomenos.html at main · brunaprogrammer/CSS-Layout · 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
<!DOCTYPE html>
<html lang="pt-br">
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta charset="utf-8">
    <link rel="stylesheet" href="CssLayout.css">
    <title>A Natureza</title>
  </head>
  <body>
    <header>
     <h1><a href="index.html">A Natureza</a></h1>
     <p> Um lugar para admirar a beleza que a natureza nos oferece</p>

    </header>

    <nav>
      <ul>
        <li><a href="montanha.html">Montanha</a></li>
        <li><a href="floresta.html">Floresta</a></li>
        <li><a href="mar.html">Mar</a></li>

        <li><a href="deserto.html">Deserto</a></li>
        <li><a href="ceu.html">Céu</a></li>
        <li><a href="fenomenos.html">Fenômenos da Natureza</a> <li>
      </ul>
    </nav>

  <div class="first">


    <div class="columnbiggest">
      <h3 style="color:#70736a">Fenômenos da Natureza</h3>

      <figure>
        <img class="img1m" src="imagens/chuva.jpeg" alt="fenomenos">
      <figcaption>Fig.1 - Fenômenos da Natureza</figcaption>
      </figure>

      <p  style="color: #333a3b;">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet pretium urna. Vivamus venenatis velit nec neque ultricies, eget elementum magna tristique.
        Quisque vehicula, risus eget aliquam placerat, purus leo tincidunt eros, eget luctus quam orci in velit. Praesent scelerisque tortor sed accumsan convallis
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet pretium urna. Vivamus venenatis velit nec neque ultricies, eget elementum magna tristique.
        Quisque vehicula, risus eget aliquam placerat, purus leo tincidunt eros, eget luctus quam orci in velit. Praesent scelerisque tortor sed accumsan convallis
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet pretium urna. Vivamus venenatis velit nec neque ultricies, eget elementum magna tristique.
        Quisque vehicula, risus eget aliquam placerat, purus leo tincidunt eros, eget luctus quam orci in velit. Praesent scelerisque tortor sed accumsan convallis
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet pretium urna. Vivamus venenatis velit nec neque ultricies, eget elementum magna tristique.
        Quisque vehicula, risus eget aliquam placerat, purus leo tincidunt eros, eget luctus quam orci in velit. Praesent scelerisque tortor sed accumsan convallis
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet pretium urna. Vivamus venenatis velit nec neque ultricies, eget elementum magna tristique.
        Quisque vehicula, risus eget aliquam placerat, purus leo tincidunt eros, eget luctus quam orci in velit. Praesent scelerisque tortor sed accumsan convallis
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sit amet pretium urna. Vivamus venenatis velit nec neque ultricies, eget elementum magna tristique.
        Quisque vehicula, risus eget aliquam placerat, purus leo tincidunt eros, eget luctus quam orci in velit. Praesent scelerisque tortor sed accumsan convallis

      </p>
    </div>
  </div>

  <div class="rodape">

      <p class="cop"> Direitos reservados copyright ©</p>

  </div>


  </body>
</html>