JessicaSilvaOliveiradosSantos/challenge-landing-page-jessica-oliveira
1
0
Fork 0
forked from M3-Academy/challenge-landing-page
Code Issues Pull Requests 2 Packages Projects Releases Wiki Activity

feat(main) adiciona as três imagens de notebook

Browse Source
This commit is contained in:
Jéssica Silva Oliveira dos Santos 2022-10-12 12:51:41 -03:00
parent 35f967a6a3
commit a16033d94d
5 changed files with 89 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/imagens/gird1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 232 KiB

BIN
assets/imagens/grid2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 212 KiB

BIN
assets/imagens/grid3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 318 KiB

52
index.html
View File

@ -46,14 +46,50 @@
</figure> </figure>
</div> </div>
<div> <section class="icones">
<figure class="icone1"> <div class="icone1">
<img src="assets/imagens/mine-foto-1.png" alt="Primeira miniatura"> <figure class="img1">
<figcaption>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. <img src="assets/imagens/mine-foto-1.png" alt="Primeiro ícone">
</figcaption> <figcaption>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
</figure> </figcaption>
</div> </figure>
</section> </div>
<div class="icone2">
<figure class="img2">
<img src="assets/imagens/mine-foto-2.png" alt="Segundo ícone">
<figcaption>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
</figcaption>
</figure>
</div>
<div class="icone3">
<figure class="img3">
<img src="assets/imagens/mine-foto-3.png" alt="Terceiro ícone">
<figcaption>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
</figcaption>
</figure>
</div>
</section >
<section class="grids">
<div >
<figure >
<img src="assets/imagens/gird1.png" alt="Notebook 1">
</figure>
</div>
<div>
<figure >
<img src="assets/imagens/grid2.png" alt="Notebook 2">
</figure>
</div>
<div>
<figure >
<img src="assets/imagens/grid3.png" alt="Notebook 3">
</figure>
</div>
</section>
</main> </main>

50
style.css
View File

@ -17,6 +17,7 @@
.logo { .logo {
display: block; display: block;
} }
.banner-p { .banner-p {
width: 100%; width: 100%;
} }
@ -46,12 +47,53 @@
font-weight: 400; font-weight: 400;
font-size: 16px; font-size: 16px;
} }
.computadores
{ .computadores {
padding: 4% 0; padding: 4% 0;
text-align: center; text-align: center;
} }
.icone1 {
width: 19%; .icones {
display: flex;
justify-content: center;
padding: 178px;
gap: 28px;
}
.icone1 {
width: 19%;
text-align: center;
background: #FFFFFF;
box-shadow: 0px 4px 20px #000000;
}
.img1 {
padding: 36px 25px 27px 26px;
}
.icone2 {
width: 19%;
text-align: center;
background: #FFFFFF;
box-shadow: 0px 4px 20px #000000;
}
.img2 {
padding: 36px 25px 27px 26px;
}
.icone3 {
width: 19%;
text-align: center;
background: #FFFFFF;
box-shadow: 0px 4px 20px #000000;
}
.img3 {
padding: 36px 25px 27px 26px;
}
.grids {
display: flex;
gap: 39px;
justify-content: center;
} }