RodrigoJorge/challenge-landing-page-Rodrigo-Jorge
1
0
Fork 0
forked from M3-Academy/challenge-landing-page
Code Issues Pull Requests Packages Projects Releases Wiki Activity

parte 5 do corpo da pagina feita

Browse Source
This commit is contained in:
Rodrigo 2022-10-10 09:56:29 -03:00
parent f29e286cde
commit 4f29c3d0fb
9 changed files with 88 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
imagens/Group (2).png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.0 KiB

BIN
imagens/Group (3).png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
imagens/Rectangle 13.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 234 KiB

BIN
imagens/Rectangle 16.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 215 KiB

BIN
imagens/Rectangle 17.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 318 KiB

BIN
imagens/laptop 1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

BIN
imagens/money (1) 2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.3 KiB

37
index.html
View File

@ -46,6 +46,43 @@
</figcaption>
</figure>
</section>
<section class="corpoPt4">
<figure>
<img src="imagens/Rectangle 13.png" alt="imagem de notebook fechado">
</figure>
<figure>
<img src="imagens/Rectangle 16.png" alt="imagem de notebook quase fechado">
</figure>
<figure>
<img src="imagens/Rectangle 17.png" alt="imagem de notebook aberto">
</figure>
</section>
<section class="corpoPt5">
<figure class="box1">
<img src="imagens/money (1) 2.png" alt="imagem de dinheiro">
<figcaption>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. </p>
</figcaption>
</figure>
<figure class="box2">
<img src="imagens/Group (1).png" alt="imagem de dinheiro">
<figcaption>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. </p>
</figcaption>
</figure>
<figure class="box3">
<img src="imagens/Group.png" alt="imagem de dinheiro">
<figcaption>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. </p>
</figcaption>
</figure>
<figure class="box4">
<img src="imagens/Group (3).png" alt="imagem de dinheiro">
<figcaption>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. </p>
</figcaption>
</figure>
</section>
</main>
</body>
</html>

50
style.css
View File

@ -67,6 +67,7 @@ main figure{
flex-direction: row;
justify-content: center;
gap: 1%;
margin-bottom: 80px;
}
section figure {
text-align: center;
@ -94,3 +95,52 @@ section figure figcaption p{
margin-top: 31px;
margin-bottom: 31px;
}
.corpoPt4{
background: #E0E0E0;
display: flex;
flex-direction: row;
width: 100%;
justify-content:center;
gap: 2%;
}
.corpoPt4 figure {
width: 29%;
margin-top: 62px;
}
.corpoPt4 figure img{
width: 100%;
}
.corpoPt5{
margin-top: 129px;
display: flex;
flex-direction: row;
width: 100%;
justify-content: center;
gap: 0.8%;
}
.corpoPt5 figure{
width: 22.5%;
}
.corpoPt5 figure p{
font-size: 16px;
margin-bottom: 65px;
}
.box1 img{
margin-top: 51px;
width: 24%;
}
.box2 img{
margin-top: 41px;
width: 24%;
}
.box3 img{
margin-top: 41px;
width: 24%;
}
.box4 img{
margin-top: 35px;
width: 20%;
}