GUJ Discussões   :   últimos tópicos   |   categorias   |   GUJ Respostas

Duvida sobre css

front-end
Tags: #<Tag:0x00007fbe94c0aa30>

#1

Comecei a estudar sobre front agora e me deparei com um problema que não consegui achar a solução. Percebi que as imagens que estou colocando no arquivo css não esta carregando na pagina. Preciso colocar uma imagem de fundo no titulo “Mirror Fashion”, mas não esta carregando

Codigo HTML

<link rel="stylesheet" type="text/css" href="css\sobre.css">
</head>
<body> 

	<img src="img\logo.png">

	<h1>A Mirror Fashion</h1>

Propriedade no arquivo .css

h1 {
	background-image: url(img/sobre-background.jpg);
	padding: 10px;
}

Não reparem na simplicidade do código, é que estou começando agr hehe.


#2

Muda as barras invertidas pra trás (’ \ ‘) pra as barras invertidas pra frente (’ / ')


#3

Troquei todas as barras para (/) mesmo assim não carregou a imagem no fundo do titulo.

O código que escrevi esta correto?


#4

vc quer algo assim?

http://jsfiddle.net/pavloschris/5Qvn7/


#5

Ola, Seguinte

O seu arquivo HTML tem que ficar assim…

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="testecss.css">
        <title></title>
    </head>
    <body>
        <h1>A Mirror Fashion</h1>
    </body>
</html>

O arquivo CSS assim:

h1 {
    background-image: url(background.jpg);
    padding: 10px;
}

é importante lembrar que para funcionar dessa forma a sua imagem tem q estar
no formato jpg
na mesma pasta que o arquivo HTML
neste exemplo eu nomeei a imagem como background.jpg

O CSS deve estar na mesma pasta do HTML
neste exemplo eu nomeei o arquivo CSS como testecss.css

Caso você queira colocar a imagem numa pasta e o css em outra ficaria assim:
HTML

<!DOCTYPE html>
<html>
    <head>
        <link rel="stylesheet" type="text/css" href="css/testecss.css">
        <title></title>
    </head>
    <body>
        <h1>A Mirror Fashion</h1>
    </body>
</html>

CSS

h1 {
    background-image: url(../img/background.jpg);
    padding: 10px;
}

#6

Boa tarde Célio. Basta você inverter as barras “” para “/” que funcionará e verifique se o seu sobre.css está na pasta css dentro do seu html. A estrutura fica assim :

—html
----------css
-----------------------sobre.css
----------js
---------img


#7

Consegui! Mas tive que colocar ("…/img/sobre-backgroud.jpg") com as " " funcionou.

Obrigado pela ajuda!