2
respostas

fundo de cor

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <title>Barbearia Alura</title>
    <link rel="stylesheet href="style.css">
    <style>
        p{
            text-align:center
        }
    </style>
</head>
<body>
    <h1 style="text-align: center">Sobre a Barbearia Alura</h1>
    <p style="text-align: center">Localizada no coração da cidade a <strong>Barbearia Alura</strong> traz para o mercado o que há de melhor para o seu cabelo e barba. Fundada em 2019, a Barbearia Alura já é destaque na cidade e conquista novos clientes a cada dia.</p>
    <p style="font-size:20px;text-align:center"><em><strong>Nossa missão é: "Proporcionar auto-estima e qualidade de vida aos clientes</strong>".</em></p>

    <p style="text-align:center">Oferecemos profissionais experientes e antenados às mudanças no mundo da moda. O atendimento possui padrão de excelência e agilidade, garantindo qualidade e satisfação dos nossos clientes.</p>
</body>    
</html> 

o css a partir desse ponto o meu código não funcionou, não consegui colocar fundo cinza nem a escrita vermelho quando pediu.

body
         {

         background: #cccccc
         }


p {
    text-align: center;
 }

 em strong{

     color:red;
 }
2 respostas

Fala ai Joselina, tudo bem? Acho que seu CSS possuí alguns detalhes de sintaxe, após definir o background faltou um ; no final da linha quando você informa o hexadecimal referente a cor.

Já na parte da cor vermelha, você precisa separar por , os elementos para que seja aplicado em ambos.

Do jeito que você fez, ele vai aplicar apenas para um elemento strong que é filho de em.

Após as alterações fica:

body  {
    background: #cccccc;
}

p {
    text-align: center;
 }

 em, strong {
    color:red;
}

Espero ter ajudado.

Olá Joselina! Existem alguns erros de sintaxe (erros de escrita) no seu código, tanto no documento HTML quanto no documento CSS.

Vou mostrar seu código em cima e o código arrumado embaixo, ok?

No documento HTML:

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <title>Barbearia Alura</title>
    <link rel="stylesheet href="style.css">
    <style>
        p{
            text-align:center
        }
    </style>
</head>
<body>
    <h1 style="text-align: center">Sobre a Barbearia Alura</h1>
    <p style="text-align: center">Localizada no coração da cidade a <strong>Barbearia Alura</strong> traz para o mercado o que há de melhor para o seu cabelo e barba. Fundada em 2019, a Barbearia Alura já é destaque na cidade e conquista novos clientes a cada dia.</p>
    <p style="font-size:20px;text-align:center"><em><strong>Nossa missão é: "Proporcionar auto-estima e qualidade de vida aos clientes</strong>".</em></p>

    <p style="text-align:center">Oferecemos profissionais experientes e antenados às mudanças no mundo da moda. O atendimento possui padrão de excelência e agilidade, garantindo qualidade e satisfação dos nossos clientes.</p>
</body>    
</html> 

Arrumando os erros de sintaxe:

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <title>Barbearia Alura</title>
    <link rel="stylesheet" href="style.css">  <------------ Faltou fechar as aspas
    <style>
        p{
            text-align:center;    <------------- Faltou `  ;  `
        }
    </style>
</head>
<body>
    <h1 style="text-align: center">Sobre a Barbearia Alura</h1>
    <p style="text-align: center">Localizada no coração da cidade a <strong>Barbearia Alura</strong> traz para o mercado o que há de melhor para o seu cabelo e barba. Fundada em 2019, a Barbearia Alura já é destaque na cidade e conquista novos clientes a cada dia.</p>
    <p style="font-size:20px;text-align:center"><em><strong>Nossa missão é: "Proporcionar auto-estima e qualidade de vida aos clientes</strong>".</em></p>

    <p style="text-align:center">Oferecemos profissionais experientes e antenados às mudanças no mundo da moda. O atendimento possui padrão de excelência e agilidade, garantindo qualidade e satisfação dos nossos clientes.</p>
</body>    
</html> 

No documento CSS:

body
         {

         background: #cccccc
         }


p {
    text-align: center;
 }

 em strong{

     color:red;
 }

Arrumando os erros de sintaxe:

body
         {

         background: #cccccc; <----------- Faltou `  ;   `
         }


p {
    text-align: center;
 }

 em, strong{ <------------- Faltou o uso da vírgula para que o seletor pegue tanto o `em` quanto o `strong`

     color:red;
 }

Espero ter ajudado com suas dúvidas!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software