pagina finalizada

maricota2202 · Mar 16, 2023 · 84436f3 · 84436f3
1 parent 9bf64c7
commit 84436f3
Show file tree

Hide file tree

Showing 42 changed files with 215 additions and 9 deletions.
diff --git a/Formula-bro.png b/Formula-bro.png
diff --git a/Johnny.jpeg b/Johnny.jpeg
diff --git a/Jungwoo.jpeg b/Jungwoo.jpeg
diff --git a/Jungwoo.jpg b/Jungwoo.jpg
diff --git a/Xiaojun.jpeg b/Xiaojun.jpeg
diff --git a/Xiaojun.jpg b/Xiaojun.jpg
diff --git a/chenle.jpeg b/chenle.jpeg
diff --git a/doyoung.png b/doyoung.png
diff --git a/haechan.webp b/haechan.webp
diff --git a/hendery.jpeg b/hendery.jpeg
diff --git a/index.html b/index.html
@@ -6,15 +6,163 @@
     <meta name="vaiewport" content="width-device-width, initiaç-scale-1.0">
     <title>Document</title>
     <link rel="stylesheet" href="style.css">
-    </head>
+    <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=Poppins&display=swap" rel="stylesheet">
+      </head>
     <body>
         <header class="cabecalho">
-            <img class="cabecalho-imagem" src="alurastart.logo.png" alt="logo da alura start">
-            <ul class="cabecalho-lista"> 
-            <li class="cabecalho-lista-item"> Escola</li>
-            <li class="cabecalho-lista-item"> Estudante</li>
+            <img class="cabecalho-imagem" src="nct-gif.gif" alt="logo nct">
+            <ul class="cabecalho-lista">
+            <li class="cabecalho-lista-item"> Kpop</li>
+            <li class="cabecalho-lista-item"> Membros</li>
         </ul>
     </header>
-
- </body>
-</HTML>
+    <section class="nct">
+        <div class="nct-div-conteudo"> <h2 class="nct-titulo">Sobre o nct </h2>
+            <p class="nct-texto-um"> O grupo de Kpop- cujo nome siginifica Neo Cultere Technlogy-é um projeto da agência SM lançada em 2016 </object></p>
+            <p class="nct-texto-dois"> Eles têm diferentes faixas de idades e nacionalidades,com apenas 10 tendo nascido na Coreia do Sul
+              Os outros 13 são de lugares como Estados Unidos,Japão,China,Tailândia,Canadá e Taiwan </p>
+        </div>
+          <img  class= "nct-imagem" src="nct.jpg" alt="grupo de kpop nct completo" >
+    </section>
+    <section class="">
+      <h2 class="nct-titulo">  Quem são os membros? </h2>
+      <div class="todos-nct">
+        <span></span>
+      <div class="mebros-div"> 
+    <img class="imagem-membros"src="chenle.jpeg" alt="foto do Chenle" >
+     <h3 class="membro-nome">Chenle</h3>
+   <a href="https://www.instagram.com/kh1000le/"> <img class="membro-icone" src="instagram.png" alt="icone instagram"> </a>
+    </div>
+    <div class="mebros-div"> 
+      <img class="imagem-membros" src="doyoung.png" alt="foto do Doyoung" >
+     <h3 class="membro-nome">Doyoung</h3>
+     <a href="https://www.instagram.com/do0_nct/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+    </div>
+    <div class="mebros-div"> 
+      <img class="imagem-membros"src="haechan.webp" alt="foto do Haechan">
+     <h3 class="membro-nome">Haechan</h3>
+     <a href="https://www.instagram.com/haechanahceah/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+    </div>
+    <span></span> 
+    <span></span>
+    <div class="mebros-div"> 
+       <img class="imagem-membros"src="hendery.jpeg" alt="foto do hendery">
+     <h3 class="membro-nome">Hendery</h3>
+     <a href="https://www.instagram.com/i_m_hendery/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+    </div>
+    <div class="mebros-div"> 
+      <img class="imagem-membros"src="jaehyun.png" alt="foto do jaehyun">
+     <h3 class="membro-nome">jaehyun</h3>
+     <a href="https://www.instagram.com/_jeongjaehyun/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+    </div>
+    <div class="mebros-div"> 
+      <img class="imagem-membros"src="jaemin.jpg" alt="foto do jaemin">
+     <h3 class="membro-nome">Jaemin</h3>
+     <a href="https://www.instagram.com/na.jaemin0813/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+    </div>
+    <span></span> 
+    <span></span>
+    <div class="mebros-div"> 
+      <img class="imagem-membros"src="jeno.jpeg" alt="foto do Jeno">
+    <h3 class="membro-nome">jeno</h3>
+    <a href="https://www.instagram.com/leejen_o_423/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+    </div>
+   <div class="mebros-div"> 
+     <img class="imagem-membros"src="Jisung.jpg" alt="foto do Jisung">
+    <h3 class="membro-nome">Jisung</h3>
+    <a href="https://www.instagram.com/nct/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+</div>
+   <div class="mebros-div"> 
+     <img class="imagem-membros"src="johnny.jpeg" alt="foto do johnny">
+    <h3 class="membro-nome">Johnny</h3>
+    <a href="https://www.instagram.com/johnnyjsuh/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+   </div>
+   <span></span> 
+   <span></span>
+   <div class="mebros-div"> 
+    <img class="imagem-membros"src="jungwoo.jpg" alt="foto do Jungwoo">
+  <h3 class="membro-nome">Jungwoo</h3>
+  <a href="https://www.instagram.com/sugaringcandy/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+  </div>
+ <div class="mebros-div"> 
+   <img class="imagem-membros"src="kun.jpg" alt="foto do Kun">
+  <h3 class="membro-nome">Kun</h3>
+  <a href="https://www.instagram.com/kun11xd/"><img class="membro-icone" src="instagram.png" alt="icone instagram"> </a>
+</div>
+ <div class="mebros-div"> 
+   <img class="imagem-membros"src="lucas.jpg" alt="foto do Lucas">
+  <h3 class="membro-nome">Lucas</h3>
+ <a href="https://www.instagram.com/lucas_xx444/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+ </div>
+ <span></span> 
+ <span></span>
+ <div class="mebros-div"> 
+  <img class="imagem-membros"src="mark.jpeg" alt="foto do Mark">
+<h3 class="membro-nome">Mark</h3>
+<a href="https://www.instagram.com/onyourm__ark/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+</div>
+<div class="mebros-div"> 
+ <img class="imagem-membros"src="renjun.jpeg" alt="foto do Renjun">
+<h3 class="membro-nome">Renjun</h3>
+<a href="https://www.instagram.com/yellow_3to3/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+</div>
+<div class="mebros-div"> 
+ <img class="imagem-membros"src="shotaro.jpg" alt="foto do Shotaro">
+<h3 class="membro-nome">Shotaro</h3>
+<a href="https://www.instagram.com/_shotaroo_/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+</div>
+<span></span> 
+<span></span>
+<div class="mebros-div"> 
+  <img class="imagem-membros"src="sungchan.jpeg" alt="foto do sungchan">
+<h3 class="membro-nome">Sungchan</h3>
+<a href="https://www.instagram.com/nct/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+</div>
+<div class="mebros-div"> 
+ <img class="imagem-membros"src="taeil.png" alt="foto do Taeil">
+<h3 class="membro-nome">Taeil</h3>
+<a href="https://www.instagram.com/mo.on_air/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+</div>
+<div class="mebros-div"> 
+ <img class="imagem-membros"src="taeyong.png" alt="foto do Taeyong">
+<h3 class="membro-nome">Taeyong</h3>
+<a href="https://www.instagram.com/taeoxo_nct/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+</div>
+<span></span> 
+<span></span>
+<div class="mebros-div"> 
+  <img class="imagem-membros"src="ten.png" alt="foto do Ten">
+<h3 class="membro-nome">Ten</h3>
+<a href="https://www.instagram.com/tenlee_1001/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+</div>
+<div class="mebros-div"> 
+ <img class="imagem-membros"src="winwin.jpeg" alt="foto do winwin">
+<h3 class="membro-nome"> Winwin</h3>
+<a href="https://www.instagram.com/wwiinn_7/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+</div>
+<div class="mebros-div"> 
+ <img class="imagem-membros"src="Xiaojun.jpg" alt="foto do Xiaojun">
+<h3 class="membro-nome">Xiaojun</h3>
+<a href="https://www.instagram.com/djxiao_888/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+</div>
+<span></span> 
+<span></span>
+<div class="mebros-div"> 
+  <img class="imagem-membros"src="yangyang.jpg" alt="foto do Yangyang">
+<h3 class="membro-nome">Yangyang</h3>
+<a href="https://www.instagram.com/yangyang_x2/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+</div>
+<div class="mebros-div"> 
+  <img class="imagem-membros"src="yuta.jpeg" alt="foto do yuta">
+<h3 class="membro-nome">Yuta</h3>
+<a href="https://www.instagram.com/yuu_taa_1026/"><img class="membro-icone" src="instagram.png" alt="icone instagram"></a>
+</div>
+  </div>
+    </section>
+    <footer class="rodape">
+      <img class="rodape-imagem" src="rodape.nct.jpg" alt="logo nct">
+       </footer>
+     </body>
+</HTML> 
diff --git a/instagram.png b/instagram.png
diff --git a/jaehyun.png b/jaehyun.png
diff --git a/jaemin.jpg b/jaemin.jpg
diff --git a/jeno.jpeg b/jeno.jpeg
diff --git a/jeno.jpg b/jeno.jpg
diff --git a/jisung.jpg b/jisung.jpg
diff --git a/kun.jpg b/kun.jpg
diff --git a/logonct.jpg b/logonct.jpg
diff --git a/logonctbranca.jpg b/logonctbranca.jpg
diff --git a/lucas.jpg b/lucas.jpg
diff --git a/mark.jpeg b/mark.jpeg
diff --git a/mark.jpg b/mark.jpg
diff --git a/nct-gif.gif b/nct-gif.gif
diff --git a/nct-logo-gif.gif b/nct-logo-gif.gif
diff --git a/nct-rodape.jpg b/nct-rodape.jpg
diff --git a/nct-rodape.png b/nct-rodape.png
diff --git a/nct.jpg b/nct.jpg
diff --git a/renjun.jpeg b/renjun.jpeg
diff --git a/rodape.jpg b/rodape.jpg
diff --git a/rodape.nct.jpg b/rodape.nct.jpg
diff --git a/rodape.verde.png b/rodape.verde.png
diff --git a/shotaro.jpg b/shotaro.jpg
diff --git a/style.css b/style.css
@@ -3,8 +3,13 @@
     padding:0;
 }
 
+body{
+  font-family: "Poppins", sans-serif;
+   background-image: linear-gradient(#4F4F4F,#000000);
+}
+
 .cabecalho {
-    background-color: #424e61;
+    background-color: #000000;
     color: white;
     display: flex;
     justify-content: space-around;
@@ -20,4 +25,57 @@
     display: inline-block;
     margin: 0 16px;
     font-size: 24px;
+}
+
+.nct-imagem {
+    width: 25%;
+}
+
+.nct {
+   background-image: linear-gradient(#000000,#4F4F4F);
+   color: white;
+   display:flex;
+   justify-content:center;
+   align-items: center;
+   padding:24px 0;
+}
+
+.nct-div-conteudo{
+   width: 35%;
+}
+.nct-titulo {
+    padding: 24px 0;
+}
+
+.imagem-membros{ 
+   width: 200px;
+}
+
+.membro-icone{
+    width: 24px;
+}
+.membros-div{
+    text-align: center;
+}
+
+.nct-titulo{
+    text-align: center;
+    padding: 50px 0;
+}
+
+.todos-nct{
+    display: grid;
+    grid-template-columns: 20% 20% 20% 20% 20%;
+}
+
+.rodape{
+    background-color:#000000;
+    text-align: center;
+
+}
+
+.rodape-imagem{
+    height: 40px ;
+    padding:12px 0;
+
 }
diff --git a/sungchan.jpeg b/sungchan.jpeg
diff --git a/taeil.png b/taeil.png
diff --git a/taeyong.png b/taeyong.png
diff --git a/ten.png b/ten.png
diff --git a/winwin.jpeg b/winwin.jpeg
diff --git a/winwin.jpg b/winwin.jpg
diff --git a/yangyang.jpg b/yangyang.jpg
diff --git a/yuta.jpeg b/yuta.jpeg