[Dúvida] Erro ao colocar Background

Fernando Albuquerque · Maio 21, 2015

Seguinte, estou criando um site e tudo mais, mas por algum motivo, não estou conseguindo colocar um background. O caminho da pasta está correto, o nome, o código, já revisei de cima à baixo e não acho o por quê de eu não estar conseguindo. Basicamente, mesmo eu colocando no CSS o background-image: url(img/back4.jpg); não acontece nada, o site permanece com a cor padrão. Alguém sabe resolver este problema?

HTML

<html>
<head>
<meta charset="UTF-8">
<title> Massacre de Realengo </title>
<link rel="stylesheet" type="text/css" href="CSS/layout.css">
</head>
<body>

<!--Banner-->
<div class="container">
<div class="BannerP">
<img src="IMG/banner.jpg" />
</div>

<!-- Menu -->
<div class="Menu">
<ul class="Menu-Top">
<li><a href="#"> INÍCIO </a></li>
<li><a href="Sobre.html"> SOBRE </a></li>
<li><a href="Fotos.html"> FOTOS </a></li>
<li><a href="Documentários.html"> DOCUMENTÁRIOS </a></li>
<li><a href="Curiosidades.html"> CURIOSIDADES </a></li>
<li><a href="Contato.html"> CONTATO </a></li>
</ul>
</div>

<!-- Main -->
<div class="Main">
<div class="Box-Left">
<img src="IMG/wellington.jpg" />
</div>
<div class="Box-Right">
<img src="IMG/welpistola.jpg" />
</div>
<div class="Box-text1">
<p> Texto Aqui </p>
<a href="#" id="Continue"> Continue lendo... </a>
</div>
<div class="Box-text2">
<p> Texto Aqui </p>
<a href="#" id="Continue"> Continue lendo... </a>
</div>
</div>

<!-- Rodapé -->
<div class="Footer">
<div class="Footer-Box">
<ul>
<li><h4> MENU </h4></li>
<li><a href="#"> INÍCIO </a></li>
<li><a href="#"> SOBRE </a></li>
<li><a href="#"> FOTOS </a></li>
<li><a href="#"> DOCUMENTÁRIOS </a></li>
<li><a href="#"> CURIOSIDADES </a></li>
<li><a href="#"> CONTATO </a></li>
</ul>
</div>
<div class="Footer-Box">
<ul>
<li><h4> SOBRE O SITE </h4></li>
<li><a href="#"> MEMBROS </a></li>
<li><a href="#"> FINALIDADE </a></li>
</ul>
</div>
<div class="Footer-Box">
<ul>
<li><h4> REDES SOCIAIS </h4></li>
<li><a href="#"> FACEBOOK </a></li>
<li><a href="#"> TWITTER </a></li>
</ul>

</div>
<div class="copyright">
Copyright © 2015 Massacre de Realengo. Todos os direitos reservados.
</div>
</div>


</div>



</body>
</html>

CSS (externo)

*{
margin: 0;
padding: 0;

}

body {
background-image: url(img/back4.jpg);
font-family: Verdana, Century, Arial;
font-size: 15px;
margin-left: 0px;
padding-top: 30px;
color: #000;
}

a {
text-decoration: none;
color: #000;
}

ul {
list-style: none;
margin-top: 0px;
padding-top: 8px;
padding-left: 0px;
}


/***-------------------------------------------------------------

Container do site

-------------------------------------------------------------***/
.container {
margin: auto;
width: 850px;
height: auto;
}


/***-------------------------------------------------------------

Banner do site

-------------------------------------------------------------***/

.Banner .BannerP img {

float: left;
width: 850px;
height: 180px;
margin-left: 335px;
}

/***-------------------------------------------------------------

menu do site

-------------------------------------------------------------***/
.menu {
background: #CCC;
width: 850px;
height: 35px;
margin: 70px 0px 0px 0px;
padding: 0px;
}

.menu li {
display: inline;
}

.menu-top li a {
width: 50px;
height: 15px;
padding: 8px 24px;
text-shadow: 0px 2px 3px #666;
margin-right: 12px;
}

.main {
width: 850px;
height: auto;
float: left;
margin: 15px 0 15px 0;
}

.main .box-left {
width: 350px;
height: 190px;
float: left;
background: #FFFFF0;
}

.main .box-right {
width: 350px;
height: 190px;
float: right;
margin-right: 15px;
background: #FFFFF0;

}

.main .box-right img {
width: 365px;
height: 325px;
}

.main .box-left img {
width: 365px;
height: 325px;
}

.main .box-text1 {
width: 335px;
height: 125px;
margin-top: 150px;
float: left;
background: #FFFFF0;
padding: 15px;
text-align: justify;
}

.main .box-text2 {
width: 335px;
height: 125px;
margin-top: 150px;
margin-right: 0px;
float: right;
background: #FFFFF0;
padding: 15px;
text-align: justify;
}


/***-------------------------------------------------------------

Rodapé do site

-------------------------------------------------------------***/
.Footer {
width: 850px;
height: 200px;
float: left;
background: #393939;
color: #FFFFE0;
margin-left: 0px;
margin-top: 0px;
}

.Footer-box {
width: 245px;
height: 180px;
float: left;

}

.Footer-box ul {
margin-left: 55px;
padding-left: 55px;
}

.Footer-box ul li {
color: #FFF;
}

.Footer-box ul li a {
color: #BBB;
}

.copyright {
margin-top: 180px;
margin-left: 148px;

}

Takanaue · Maio 22, 2015

Tenta mudar

background-image: url(img/back4.jpg);

Para:

background-image: url("img/back4.jpg");

joao22666 · Junho 18, 2015

Testei seu código aqui e funcionou perfeitamente. Dá uma olhada se o arquivo back4.jpg não está corrompido.

Entrar

[Dúvida] Erro ao colocar Background

Pergunta

Fernando Albuquerque

Link para o comentário

Compartilhar em outros sites

2 respostass a esta questão

Posts Recomendados

Takanaue

Link para o comentário

Compartilhar em outros sites

joao22666

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades