-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
163 lines (151 loc) · 6.81 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
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="author"content="Aparecida Fernanda">
<meta name="keywords"content="anime, cosplay, mangá">
<link rel="stylesheet" href="../css/anima.css">
<link rel="stylesheet" href="../css/responsivo.css">
<title>Anima Ai</title>
</head>
<body>
<!-- cabeçalho -->
<header class="container_header">
<div id="img_header">
<div class="titulo_header">
<h1>Anima Ai</h1>
</div>
<div class="chamada_header">
<p>Tudo sobre o universo dos animes, quadrinhos e games venha fazer parte do Anima Ai</p>
</div>
</div>
</header>
<!-- barra de navegação -->
<nav>
<ul>
<li><a class="link_menu" href="#">Home</a></li>
<li><a class="link_menu" href="#">Assistir</a></li>
<li><a class="link_menu"href="#">Curiodidades</a></li>
<li><a class="link_menu"href="#">Eventos</a></li>
</ul>
</nav>
<!-- menu responsivo -->
<div class="dropdown">
<span>☰</span>
<div class="conteudo_drop">
<a class="link_mobile"href="#" target="_blank">Home</a>
<a class="link_mobile"href="#" target="_blank">Assistir</a>
<a class="link_mobile"href="#" target="_blank">Curiodidades</a>
<a class="link_mobile"href="#" target="_blank">Eventos</a>
</div>
</div>
<div class="container">
<!-- principal -->
<main class="main">
<div class="card_main">
<a href=""><h2>Diferenças entra Mangá e Quadrinhos </h2></a>
<article class="card_article">
<img class="img_card" src="../img/sushi (2).jpg" alt="miojo">
<div class="card">
<a href=""><h3>Mangá</h3></a>
<div class="data">
<address>Aparecida fernanda</address>
<time datetime="17-07-2022">17-07-2022</time>
</div>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Dolorem aspernatur iusto tenetur aperiam labore, eos eligendi incidunt necessitatibus obcaecati sunt eaque ipsum consectetur assumenda blanditiis nulla inventore similique adipisci facilis!</p>
</div>
</article>
<article class="card_article">
<img class="img_card" src="../img/astronalta.jpg" alt="miojo">
<div class="card">
<a href=""><h3>Quadrinhos</h3></a>
<div class="data">
<address>Aparecida fernanda</address>
<time datetime="17-07-2022">17-07-2022</time>
</div>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellendus quaerat provident vitae velit necessitatibus repudiandae labore delectus. Animi, iste accusantium dolorem, nemo exercitationem hic voluptatem rem libero voluptates quia odit.</p>
</div>
</article>
</div>
</main>
<!-- latetal -->
<aside class="side">
<section class="sidebar">
<a href=""><h2>Animes do Momento</h2></a>
<a>
<article class="card_side">
<img class="img_side" src="../img/sushi (1).jpg" alt="miojo">
<div class="date_side">
<h3>Spy X Family</h3>
<div class="data">
<address>Aparecida fernanda</address>
<time datetime="17-07-2022">17-07-2022</time>
</div>
</div>
</article>
</a>
<a>
<article class="card_side">
<img class="img_side" src="../img/background_ceu_amarelo Designed by Freepik.jpg" alt="miojo">
<div class="date_side">
<h3>Demon Slayer</h3>
<div class="data">
<address>Aparecida fernanda</address>
<time datetime="17-07-2022">17-07-2022</time>
</div>
</div>
</article>
</a>
<a>
<article class="card_side">
<img class="img_side" src="../img/background_comic_colorido_Designed by coolvector Freepik.jpg" alt="miojo">
<div class="date_side">
<h3>Boku No Hero</h3>
<div class="data">
<address>Aparecida fernanda</address>
<time datetime="17-07-2022">17-07-2022</time>
</div>
</div>
</article>
</a>
<a>
<article class="card_side">
<img class="img_side" src="../img/sushi (1).jpg" alt="miojo">
<div class="date_side">
<h3>Spy X Family</h3>
<div class="data">
<address>Aparecida fernanda</address>
<time datetime="17-07-2022">17-07-2022</time>
</div>
</div>
</article>
</a>
</section>
</aside>
</div>
<!-- jogos -->
<section class="section_gamer">
<h2>Novidades do Universo Gamer</h2>
<div class="img_gamer"></div>
</section>
<!-- eventos -->
<section class="section_eventos">
<h2>Eventos</h2>
<div class="img_eventos">
<p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Nobis, tempora reiciendis veritatis mollitia vel eius quidem iure sapiente incidunt beatae perferendis doloribus obcaecati neque, quisquam vero minima, dignissimos excepturi ipsum?</p>
</div>
</section>
<!-- footer -->
<footer class="footer">
<address>
<p>Aparecida Fernanda</p>
<br>
<a href="https://www.linkedin.com/in/cidinha-dev/"> Linkedin</a>
</address>
</footer>
<!-- rodapé -->
<script src="js/index.js"></script>
</body>
</html>