Entrar Ainda não tem acesso?
1
resposta

[Projeto] Atividades CSS Estilização

por Estudante
| 29.5k xp | 29 posts

HTML

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Portifolio de Marcos Bertucci</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <header></header>
    <main>
        <h1>Eleve seu negócio digital a outro nível <strong class="titulo-destaque"> com um Front-end de qualidade!</strong></h1>
        <p>Olá! Sou <strong class="nome-dev">MarcosBertucci</strong>, desenvolvedor Front-end com especialidade em React, HTML e CSS. Ajudo pequenos negócios e designers a colocarem em prática boas ideias. Vamos conversar?</p>
        <a href="https://instagram.com/narcosb">Instagram</a>
        <a href="https://github.com/MarcosBertucci">GitHub</a>
        
    </main>
    <img src="IMG_20240117_101638.jpg" alt="Foto perfil Marcos" width="300" height="340">
    <footer>Contato Marcos Bertucci: (61)97528577</footer>
</body>
</html>

CSS

* {
margin: 1px;
border: 2px red;
padding: 2px;
content: calc(20*2);
}
body {
    background-color:#79807f;
} 

h1 {
    margin: 10px;
    padding: 15px;
    color: #FFFFFF;
}
.titulo-destaque{
    color: #12cdea;
}
p {
    color: #d5e0e5;
}
.nome-dev{
    color: gold;
}
a {
    color: navy;
}

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

1 resposta
por Rafaela Petelin Silvério
| 1134.9k xp | 2545 posts
Alura Scuba Team

Olá! Tudo bem?

Parabéns pela realização da atividade proposta! Você fez um ótimo trabalho na estilização do portfólio!

Deixo uma dica: notei que você está usando a propriedade border de forma incorreta. O correto seria border: 2px solid red; para definir uma borda vermelha sólida de 2 pixels.

Além disso, a propriedade content que você está usando no seletor universal * não é aplicável a elementos normais, apenas a elementos pseudo como ::before e ::after. Você pode removê-la.

A versão corrigida ficaria assim:

* {
    margin: 1px;
    border: 2px solid red;
    padding: 2px;
}

body {
    background-color: #79807f;
}

h1 {
    margin: 10px;
    padding: 15px;
    color: #FFFFFF;
}

.titulo-destaque {
    color: #12cdea;
}

p {
    color: #d5e0e5;
}

.nome-dev {
    color: gold;
}

a {
    color: navy;
}

Espero ter ajudado. Conte sempre com o apoio do fórum :)

Abraços e bons estudos!

Caso este post tenha lhe ajudado, por favor, marcar como solucionado ✓