Humberto.Ferro/challenge-landing-page-humberto.ferro
1
0
Fork 0
forked from M3-Academy/challenge-landing-page
Code Issues Pull Requests Packages Projects Releases Wiki Activity

criar subtitulo e descrição de baixo

Browse Source
This commit is contained in:
HUMBERTO ANTONIO CORREIA FERRO 2022-10-11 17:31:04 -03:00
parent 4eb6e17622
commit b8a2b40008
3 changed files with 27 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
assets/image/image-oculos-completo.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 245 KiB

21
assets/style/main.css
View File

@ -140,6 +140,26 @@ body{
line-height: 24px;
font-size: 16px;
}
.bottom-text{
display: flex;
justify-content: center;
align-items: center;
}
.bottom-description{
max-width: 550px;
}
.bottom-subtitle{
font-weight: 600;
font-size: 32px;
line-height: 39px;
text-align: center;
}
.bottom-descriptions{
font-weight: 400;
font-size: 16px;
line-height: 24px;
text-align: center;
}
@media (max-width: 1024px) {
.main-banner-desktop {
display: none;
@ -148,6 +168,7 @@ body{
display: block;
width: 100%;
}
}
@media screen and (max-width:1024px) {
.top-infocard{

10
index.html
View File

@ -8,6 +8,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<title>Page M3 Academy</title>
<link href="https: //fonts.googleapis.com/css2? família= Inter:wght@400;500 &family= Roboto+Mono:wght@100 & family= Shadows+Into+Light & display=swap" rel="stylesheet">
<link href="https: //fonts.googleapis.com/css2? família= Inter:wght@600 &family= Roboto+Mono:wght@100 & display=swap" rel="stylesheet">
<link rel="stylesheet" href="assets/style/main.css"/>
</head>
<body>
@ -76,11 +77,12 @@
<p class="bottom-card-description">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>
</div>
</section>
<section>
<div>
<h2></h2>
<p></p>
<section class="bottom-text">
<div class="bottom-description">
<h2 class="bottom-subtitle">Lorem ipsum dolor sit amet</h2>
<p class="bottom-descriptions">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vulputate sapien non libero faucibus interdum. In eget tincidunt ipsum. Quisque a tellus at lectus blandit tempor. Ut tristique auctor mi eget hendrerit. Curabitur venenatis felis vitae sagittis venenatis. Donec finibus turpis vitae lectus interdum rutrum vitae sed augue.</p>
</div>
</section>
</main>