O caractere de copyright não está aderindo à estilização do CSS. Onde estou errando?
<footer>
<img src="">
<p class="copyright">© Copyright Cat Café - 2021</p>
</footer>.copyright {
color: #595959;
font-size: 15px;
} 
Solucionado
O caractere de copyright não está aderindo à estilização do CSS. Onde estou errando?
<footer>
<img src="">
<p class="copyright">© Copyright Cat Café - 2021</p>
</footer>.copyright {
color: #595959;
font-size: 15px;
} 
Oi Jeanna, tudo bem?
Rodei o seu código aqui e me parece normal! Fiz até uma estilização extra para ter certeza que está funcionando, veja:
.copyright {
color: blue;
font-size: 40px;
}E o resultado:
Dessa maneira, poderia explicar um pouco melhor qual o problema? Ou talvez mandar o código completo se realmente não estiver funcionando.
Espero ter ajudado =)
Olá! O código completo:
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<title>Menu</title>
<link rel="stylesheet" href="reset.css">
<link rel="stylesheet" href="style.css">
</head>
<body>
<header>
<div class="header">
<h1><img src="logo.png"></h1>
<nav>
<ul>
<li><a href="index.html">Início</a></li>
<li><a href="menu.html">Menu</a></li>
<li><a href="contato.html">Contato</a></li>
</ul>
</nav>
</div>
</header>
<main>
<ul class="menu">
<li>
<h2>Cappuccino</h2>
<img src="cappuccino.jpg">
<p class="descricao-produto">Cappuccino tradicional feito com o melhor café nacional.</p>
<p class="preco">R$ 5</p>
</li>
<li>
<h2>Empadas</h2>
<img src="empada.jpg">
<p class="descricao-produto">Empadas caseiras deliciosas.</p>
<p class="preco">R$ 5</p>
</li>
<li>
<h2>Bolo Matilda</h2>
<img src="matilda.jpg">
<p class="descricao-produto">Bolo de ganache chocolatudo.</p>
<p class="preco">R$ 8/fatia</p>
</li>
</ul>
</main>
<footer>
<img src="">
<p class="copyright">© Copyright Cat Café - 2021</p>
</footer>
</body>
</html>header {
background: #b3daff;
}
.header {
position: relative;
width: 940px;
margin: 0 auto;
}
header h1 img {
width: 100x;
height: 100px;
}
nav {
position: absolute;
top: 50px; /*metade do valor em px da logo */
right: 0;
}
nav li {
display: inline;
margin: 0 0 0 15px;
}
nav a {
text-transform: uppercase;
color: #595959;
font-size: 20px;
font-weight: bold;
text-decoration: none;
}
nav a:hover {
color: #cc99ff;
}
nav a:active {
color: #bfbfbf;
}
.menu {
width: 940px;
margin: 0 auto;
padding: 50px 0;
}
.menu li {
display: inline-block;
text-align: center;
width: 30%;
vertical-align: top;
margin: 0 1.5%;
padding: 20px 20px;
box-sizing: border-box;
border: 2px solid #595959;
border-radius: 10px;
}
.menu li:hover {
border-color: #9933ff;
}
.menu li:active {
border-color: #cc99ff;
}
.menu img {
width: 200px;
height: auto;
margin: 30px 0;
}
.menu h2 {
font-size: 30px;
font-weight: bold;
color: #595959;
}
.menu li:hover h2 {
color: #9933ff;
}
.menu li:active h2 {
color: #cc99ff;
}
.preco {
font-size: 22px;
font-weight: bold;
color: #595959;
margin-top: 10px;
}
.descricao-produto {
font-size: 18px;
color: #595959;
}
footer {
text-align: center;
background: url("footer.jpg");
padding: 40px;
}
.copyright {
color: #595959;
font-size: 15px;
}
Boa tarde Jeanna o problema pode ser no proprio programa, as vezes acontece tente fechar o programa e fazer de novo, as vezes ele da uma bugada.
Tem outra coisa que pode estar ocorrendo, reveja esta parte:
footer {
text-align: center;
background: url("footer.jpg"); # Aqui na imagem que voce colocou, veja se não esta com a cor do background igual a do texto, talvez seja por isso que não esta aparecendo.
padding: 40px;
}