2010-03-08 5 views
5

Dans parmi mes CSS je donne les résultats suivants:CSS chemin background-image Problèmes

#framecontentTop{ 
position: absolute; 
top: 0; 
left: 120px; 
right: 0; 
height: 100px; 
overflow: hidden; 
background-image: url(/Users/myname/Website Project/logo.jpg); 
color: white; 
}

Lorsque le chemin de l'image que je veux utiliser comme arrière-plan-image est/Users/myname/Site Web du projet/logo .jpg

Cependant, quand je mets dans mon div avec l'ID framecontentTop, il ne montre pas l'image (ou même quoi que ce soit) que l'arrière-plan. Il n'y a pas d'autres divs dans le CSS à entrer en conflit avec elle, et quand je mets l'arrière-plan framecontentTop à une couleur ou le garder comme une image, mais mettre l'URL comme une image aléatoire en ligne, il le charge bien. Donc, je ne peux que supposer que le problème est avec la façon dont j'ai spécifié le chemin de l'image - quelqu'un peut-il voir ce que j'ai fait mal ici?

Un grand merci

Répondre

13

Si vous avez des caractères spéciaux, ils doivent être protégés, ou dans le cas de l'espace blanc, au moins cité, comme celui-ci :

background-image: url("/Users/myname/Website Project/logo.jpg"); 

Vous pouvez voir le W3C Spec pour les exigences complètes.

Certains caractères apparaissant dans un unquoted URI, tels que les parenthèses, virgules, des caractères blancs, des guillemets simples (') et des guillemets doubles ("), doivent être échappés avec une barre oblique inverse pour que la valeur URI résultante est une jeton URI:. '(', ')', '\'

+0

Merci, j'ai essayé cela avec ce que Jesse a suggéré ci-dessus et je reçois toujours le même (manque de) résultat – Deacon

+0

@Deacon! - Si votre image sur le chemin www.mysite.com/Users/myname .... –

+0

@ Nick - non, c'est à l'heure actuelle encore tous local pour son chemin file: /// Users/myname ... ... – Deacon

3

Vous utilisez un chemin absolu qui sera toujours résoudre à la même URL sur votre serveur. Si cela fonctionne quand vous le mettez dans l'élément A, mais ne fonctionne pas dans l'élément B, les chances sont le problème est pas avec l'URL, mais un autre paramètre background ou background-image interférer.

Je voudrais utiliser la fonction « Inspecter l'élément » Firebug pour savoir s'il y a un autre paramètre d'arrière-plan primant.

URL avec des espaces doivent toujours être entre guillemets par le chemin:

background-image: url("/Users/myname/Website Project/logo.jpg");