Solucionado (ver solução)
Solucionado
(ver solução)
6
respostas

ALTERAÇÃO DO TAMANHO DA FONTE NO TÍTULO

Usei a propriedade a font-size conforme indicado no projeto para alterar o tamanho da fonte do texto. Seguindo conforme o projeto do Figma, porém não dá certo, o tamanho não se altera.

 <!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>Portfolio</title>
        <link rel="stylesheet" href="style.css">
</head>
<body>
  <header></header>
  <main class="apresentacao">
        <section class="apresentacao__conteudo">    
         <h1 class="conteudo__titulo">Eleve seu negócio digital a outro nível
          <strong class="titulo-destaque">com um Front end de qualidade!</strong></h1>
           <p>Olá! Sou Joana Santos, desenvolvedora Front-end com especialidade em React, HTML e CSS. Ajudo pequenos negócios e designers a colocarem
        a colocarem em prática boas ideias. Vamos conversar? </p>
        <a href="https://instagram.com/rafaballerini">Instagram</a>
         <a href="https://github.com/guilhermeonrails">Github</a>
          </section>
           <img src="imagem.png"  alt="Foto da Joana Santos progamando">
        </main>
  <footer></footer>   
</body>
</html>

CSS

*{ 
  margin: 0; 
  padding: 0;  
}

body {
    height: 100vh;
    box-sizing: border-box;
    background-color: black;
    color: hwb(0 100% 0%);
}

.titulo-destaque {
    color: #22D4FD;
}

.apresentacao {
     margin: 2%;
     display: flex;
     align-items: center;
     justify-content: space-between;
}

.apresentacao__conteudo {
  width: 615px;
}

.conteudo__titulo {
  font-size: 36px;
}

O CÓDIGO NO NAVEGADOR SE APRESENTA DA SEGUINTE FORMA: Insira aqui a descrição dessa imagem para ajudar na acessibilidade

6 respostas

Olá, Juliana!

Seu código foi testado e o código mencionado não demonstra erros, e tem o comportamento esperado o título que é a class que recebe o valor font-size: 36px; e funciona como esperado, agora caso queria aumentar o tamanho da font da tag <p> você pode utilizar a seguinte função:

.apresentacao__conteudo p{
    font-size: 100px;
  }

Espero ter ajudado e reforço que em casos de dúvidas, conte sempre com o fórum da comunidade Alura! Bons estudos!

Sucesso

Um grande abraço e até mais!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓. Bons Estudos!

ah entendi, olha deu certo! eu testei ao invés de 100 px com 30 px, ficou melhor. Acredito que seja pela configuração da minha web.

Porém uma outra pergunta, que na minha cabeça não está fazendo sentido, quando eu coloco a tag conforme você sugeriu que alteraria apenas a tag

, toda a section é alterada. No caso né, todos os textos, contendo o título e parágrafo. No caso, usei dessa forma:

.apresentacao__conteudo p{
    font-size: 30px;
  }
O projeto ficou então, da seguinte forma: 

Insira aqui a descrição dessa imagem para ajudar na acessibilidade

De qualquer forma, entendo que está correto. Mas a questão das tags que me deixa confusa 
solução!

Segui com o projeto, conforme temos na aula, e depois então, temos alteração do tamanho da fonte do parágrafo.

No meu caso, então ficou:

.apresentacao__conteudo__texto{
  font-size: 24px;
}

A apresentação conteudo texto, é a classe criada dentro da tag p do meu arquivo html. Porém, o tamanho da fonte, também não muda. permanece o mesmo. Ficando assim: Insira aqui a descrição dessa imagem para ajudar na acessibilidade

A ideia é que o titulo fique com a fonte maior e o parágrafo, fique com a fonte um pouco menor. Porém, eu ainda acho que a fonte da tag

, poderia ficar um pouco maior. Mas mesmo criando a classe e acrescentando no arquivo css, o tamanho não se altera

Já consegui resolver, obrigada <3

Olá Juliana!

Que bom que deu certo, importante que para cada tag, você crie uma class responsável, deste modo você consegue melhor organizar seu código, e tem um maior controle sobre cada tag facilitando a manutenção e possíveis alterações.

Bons estudos!

Sucesso

Abraços!