-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
108 lines (91 loc) · 4.94 KB
/
index.html
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
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300..900;1,300..900&family=Secular+One&display=swap" rel="stylesheet">
<link rel="stylesheet" href="src/reset.css">
<link rel="stylesheet" href="src/estilos.css">
<link rel="stylesheet" href="src/responsivo.css">
<link rel="shortcut icon" href="imagem/faviconoanel.ico" type="image/x-icon">
<title>Projeto O Senhor dos Anéis</title>
</head>
<body>
<main class="personagens">
<div class="personagem">
<img class="imagem" src="imagem/aragorne2full.jpg" alt="foto-de-aragorne">
<div class="conteudo">
<i class="logo"></i>
<h2 class="nome-personagem">Aragorn - Passolargo</h2>
<p class="descricao">'Eu sou Aragorn, filho de Arathorn, e sou chamado de Elessar, Pedra-Elfica, Dúnadan, Herdeiro de Isuldur, Filho de Elendil de Gondor'. Uns dos persosnagens chave de o <strong>Senhor dos Anéis</strong> que junto de Gandalf e Frodo, contribuiu para derrocada de Sauron. Aragorn tem muitas camadas que fazem dele um personagem peculiar. </p>
</div>
</div>
<div class="personagem">
<img class="imagem" src="imagem/frodo-bolseirofull.png" alt="foto de frodo bolseiro">
<div class="conteudo">
<i class="logo"></i>
<h2 class="nome-personagem">Frodo Bolseiro</h2>
<p class="descricao">Frodo Bolseiro é um hobbit que foi escolhido para ser portador do Um anel e assim leva-ló a montanha da perdição para destuílo. Frodo foi escolhido pois tem resistência aos efeitos de corrupção da alma do Um anel, o que não era comum com outos seres da Terra Média.</p>
</div>
</div>
<div class="personagem selecionado">
<img class="imagem" src="imagem/gandalf-full2.jpg" alt="foto-de-gandalf">
<div class="conteudo">
<i class="logo"></i>
<h2 class="nome-personagem">Gandalf O cinzento</h2>
<p class="descricao">Gandalf é conhecido como Mago na Terra Média, mas na verdade ele é um Maiar, seres enviados à Terra para auxiliar e encorajar os povos contra Sauron.</p>
</div>
</div>
<div class="personagem">
<img class="imagem" src="imagem/sauron.jpg" alt="foto-de-sauron">
<div class="conteudo">
<i class="logo"></i>
<h2 class="nome-personagem">Sauron</h2>
<p class="descricao">Inimigo dos povos da Terra-Média na Segunda e Terceira Era, Sauron foi o responsavel pela forja do Um anél e tenta recupera-ló para alcançar a totalidade de seus poderes. Anteriormente foi um servo de Morgoth, até sua derrocada para finalmente tornar-se Senhor das Trevas e iniciar sua busca pela conquista dos povos da Terra Média.</p>
</div>
</div>
<div class="personagem">
<img class="imagem" src="imagem/arwen1920X1200.jpg" alt="foto-de-arwen">
<div class="conteudo">
<i class="logo"></i>
<h2 class="nome-personagem">Arwen Úndomiel</h2>
<p class="descricao">'Escura é a sombra, e no entanto, meu coração se regozija; pois tu, Estel, hás de estar entre os grandes cuja a valentia a destruirá.'</p>
<p class="descricao">Arwen, filha de Elrond, estrela vespertina de seu povo, é uma elfo de beleza explendida. Na Terceira Era Arwen se uni a Aragorn após a derrota de Sauron. A personagem ganhou mais destaque nos filmes do Peter Jackson, sendo interpretada pela atriz Liv Tyler.</p>
</div>
</div>
</main>
<ul class="botoes">
<li>
<button class="botao">
<img src="imagem/logoarvorebranca90x86.jpg" alt="logo do aragorne">
</button>
</li>
<li>
<button class="botao">
<img src="imagem/logoferroada90x86.jpg" alt="logo ferroada">
</button>
</li>
<li>
<button class="botao selecionado">
<img src="imagem/logocajado90x86.jpg" alt="logo de gandalf">
</button>
</li>
<li>
<button class="botao">
<img src="imagem/logooanel90x86.jpg" alt="logo de sauron">
</button>
</li>
<li>
<button class="botao">
<img src="imagem/logobroche90x86.jpg" alt="logo de arwen">
</button>
</li>
</ul>
<footer>
<p>Site criado por <a href="https://github.com/PriscillaOliveiraa" target="_blank">Priscila Oliveira</a></p>
</footer>
<script src="src/index.js"></script>
</body>
</html>