ola, boa tarde!
eu simplesmente estou com 6 erros no meu projeto aluraPlus e nao estou sabendo corrigir...
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
ola, boa tarde!
eu simplesmente estou com 6 erros no meu projeto aluraPlus e nao estou sabendo corrigir...
Olá, Rodrigo.
Tudo bem?
Compartilha os seus códigos HTML e CSS completos aqui com a gente por gentileza, você pode copiar e colar eles completos aqui mesmo. Assim fica melhor para ajudar.
Sigo aguardando, valeu.
segue o codigo..
<!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">
<title>Alura Plus</title>
<link rel="stylesheet" href="style.css">
<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= Krona+One & family= Montserrat:ital,wght@0,400;1,100família= Inter:wght@400;700 & & display =swap" rel="stylesheet">
</head>
<body>
<section class="container principal">
<div class="container__caixa">
<h1 class="container__titulo">Com o Combo+, você pode aproveitar a Alura+ e o Alura Língua por um preço único.</h1>
<img src="img/Combo.png" alt="O combo 'e a junçao" class="container__imagem">
<a href="www.alura.com.br" class="container__botao">Assine por 12x de R$120,00*</a>
<a href="www.alura.com.br" class="container__botao botao_secundario"> Assinar somente o Alura+</a>
<p class="container__aviso">*O preço pode variar caso a assinatura seja feita em outros planos.</p>
</div>
</section>
<section class="container secundario">
<img src="img/Pixel True Mockup 1.png" alt="monitor e um celular" class="secundario__imagem">
<div class="container__descricao">
<h2 class="descricao__titulo">Assista do seu jeito</h2>
<p class="descricao__texto">Aproveite a tela grande da TV ou assista no tablet, laptop, celular e outros
aparelhos. Nossa seleção de cursos não para de crescer.</p>
</div>
</section>
<section class="container secundario">
<div class="container__descricao">
<p class="descricao__texto">Só o Combo+ oferece Alura+ e Alura Língua juntos para você ter acesso a cursos
de diversas áreas da tecnologia e aprender inglês ou espanhol, onde e como quiser.</p>
<a href="www.alura.com.br" class="container__botao secundario__botao">Assinar o combo+</a>
</div>
<img src="img/Telas.png" alt="tela da alura plus e lingua" class="secundario__imagem">
</section>
<section class="container secundario">
<img src="img/Notebook.png" alt="notebook">
<div class="container__descricao">
<h2 class="descricao__titulo">Baixe seus cursos</h3>
<p class="descricao__texto">Baixe e assista quando e onde quiser. Assim, seus favoritos estão sempre
com você, até mesmo sem internet.</p>
</div>
</section>
<section class="dispositivos">
<h2 class="dispositivos__titulo">Disponível nos seus dispositivos favoritos</h2>
<ul class="dispositivos__lista">
<li>
<img src="img/tv.png" alt="">
<h3 class="lista__item">Tv</h3>
</li>
<li>
<img src="img/computador.png" alt="">
<h3 class="lista__item">Computador</h3>
</li>
<li>
<img src="img/celular.png" alt="">
<h3 class="lista__item">Celular</h3>
</li>
</ul>
</section>
<footer class="rodape">
<img src="img/Logo.png" alt="logo" class="rodape__imagem">
<ul class="rodape__lista">
<li class="lista__link">
<a href="#">Idioma</a>
</li>
<li class="lista__link">
<a href="#">Disponível compatíveis</a>
</li>
<li class="lista__link">
<a href="#">Contrato de assinatura</a>
</li>
<li class="lista__link">
<a href="#">Politica de privacidade</a>
</li>
<li class="lista__link">
<a href="#">Proteçao de dados no Brasil</a>
</li>
<li class="lista__link">
<a href="#">Anuncios personalizados</a>
</li>
<li class="lista__link">
<a href="#">Ajuda</a>
</li>
</ul>
<p class="rodape__texto">® 2021 Alura, Alura+ e Alura Língua. Todos os direitos reservados. Serviço de assinatura paga.
Conteúdo sujeito a disponibilidade.</p>
<p class="rodape__texto">Alura+ é um serviço pago, baseado em assinatura e sujeito a termos e condições.
O serviço Alura+ é comercializado por Aovs Sistemas de Informática S.A.,
Rua Vergueiro, 3185 - Liberdade, São Paulo - SP, 04101-300, Brasil e CNPJ 05.555.382/0001-33</p>
</footer>
</body>
</html>:root {
--branco-principal: #ffffff;
--cinza-secundaria: #c0c0c0c0;
--botao-azul: #167bf7;
--cor-de-fundo: #00030C;
--fonte-principal: 'inter';
--botao-azul-efeito: rgb(16, 197, 16);
}
body {
background-color: var(--cor-de-fundo);
color: var(--branco-principal);
font-family: var(--fonte-principal);
font-size: 16px;
font-weight: 400;
}
* {
margin: 0;
padding: 0;
}
.principal {
background-image: url("img/Background.png");
background-repeat: no-repeat;
background-size: contain;
align-items: center;
text-align: center;
}
.container {
height: 100vh;
display: grid;
grid-template-columns: 50% 50%;
}
.container__botao {
background-color: var(--botao-azul);
border-radius: 10px;
padding: 1em;
color: var(--branco-principal);
display: block;
text-decoration: none;
margin-bottom: 1em;
}
.botao_secundario {
background-color: transparent;
border: 2px solid var(--branco-principal)
}
.container__aviso {
font-size: 12px;
color: var(--cinza-secundaria);
}
.container__titulo {
font-size: 28px;
}
.container__imagem {
margin: 1em 0 2em 0;
}
.container__caixa {
margin: 0 6em;
}
.secundario__imagem {
width: 80%;
}
.secundario {
align-items: center;
margin: 0 10em;
}
.descricao__titulo {
font-weight: 700;
font-size: 48px;
color: var(--branco-principal);
margin-bottom: 0,1em;
}
.descricao__texto {
color: var(--cinza-secundaria);
}
.secundario__botao {
display: Inline-block;
margin-top: 1em;
}
.container__descricao {
padding: 2em;
}
.dispositivos__lista {
display: flex;
justify-content: center;
list-style-type: none;
margin: 5em 0;
}
.dispositivos {
text-align: center;
}
.dispositivos__titulos {
font-size: 48px;
color: var(--branco-principal);
}
.lista__item {
font-size: 32px;
color: var(--branco-principal);
}
.rodape {
text-align: center;
margin: 5em 3em;
}
.rodape__lista {
display: flex;
justify-content: center;
list-style-type: none;
margin-top: 1em;
}
.lista__link {
text-decoration: none;
color: var(--branco-principal);
margin-left: 1em;
}
.rodape__texto {
margin: 1em 0;
color: var(--cinza-secundaria);
font-size: 14px;
}
.lista__link a:hover {
color: var(--branco-principal);
}
.lista__link a:active {
color: aquamarine;
}
.container__botao:hover {
background-color: var(--botao-azul-efeito);
color: var(--cor-de-fundo);
}
@media screen and (max-width: 768px) {
.container {
display: block;
background-image: none;
}
.container__imagem {
width: 50vw;
}
.container__caixa {
margin: 2em 2em;
}
.secundario {
margin: 0;
text-align: center;
}
.secundario__imagem {
width: 50vw;
}
.dispositivos__lista {
display: block;
}
.rodape__lista {
display: block;
}
}Olá, Rodrigo.
Eu copiei os seus código HTML e CSS e testei, e funcionaou certinho.
Qual seria o erro que aparece no caso?
Boa noite!
Rodrigo eu copiei seus códigos aqui e também não tive erros (na verdade tive mas foram erros por nao ter as imagens que vc esta carregando no código). tenta tirar um print dos erros e mandar aqui.
bons estudos