[XHTML + CSS] Utilisation de la property css background

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : [XHTML + CSS] Utilisation de la property css background

Cherrytree

cn=?

Code :

<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Toto</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="styles/default.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h1 id="header"><span class="alt">Toto</span></h1>
</body>
</html>

Code :

#header {
background: url(images/title.gif) no-repeat;
height: 53px;
margin: 10px;
width: 148px;
}
.alt {
display: none;
}

J'essaie de faire afficher une image via background dans mon <h1>. J'ai vu faire cela dans http://www.zeldman.com, mais je n'arrive pas faire fonctionner mon code : aucune image n'apparait.

---------------
Le site de ma maman

Publicité

gizmo

l'adresse de l'image est-elle bien realtive à celle du CSS? et non celle de la page?

urd-sama

waste of space

gizmo a écrit :

l'adresse de l'image est-elle bien realtive à celle du CSS? et non celle de la page?

oui :jap:
je vais essayer de faire quelques tests, je dois dire que j'avais jamais testé un background sur un h1

urd-sama

waste of space

j'ai obtenu qqch avec ca:

Code :

.header {
background-image: url('image.gif');
height: 53px;
margin: 10px;
width: 148px;
border: 1px black solid;
}

et en enlevant l'appel de la class alt, qui en fait te cache tout. (le border c'est pour mieux voir). c'est qqch du style que tu cherches?

ps: on peut bien sur rajouter
background-repeat: no-repeat;

Message édité par urd-sama le 20-08-2003 à 08:53:22

Cherrytree

cn=?

gizmo a écrit :

l'adresse de l'image est-elle bien realtive à celle du CSS? et non celle de la page?

Bien vu, à tous les coups c'est ça. ça m'a tracassé pendant tout le trajet jusqu'à ma boite. Je teste illico, mais bon je suis sûr que c'est ça. Merci donc.

---------------
Le site de ma maman

Cherrytree

cn=?

Urd-sama a écrit :

j'ai obtenu qqch avec ca:

Code :

.header {
background-image: url('image.gif');
height: 53px;
margin: 10px;
width: 148px;
border: 1px black solid;
}

et en enlevant l'appel de la class alt, qui en fait te cache tout. (le border c'est pour mieux voir). c'est qqch du style que tu cherches?

ps: on peut bien sur rajouter
background-repeat: no-repeat;

Non, le display: none; n'est que pour le span. En gros c'est un fonctionnement dégradé pour les navigateurs qui ne parlent pas CSS. Si le css est bien analysé, l'image s'affiche. Sinon le texte.

---------------
Le site de ma maman

urd-sama

waste of space

Cherrytree a écrit :

Non, le display: none; n'est que pour le span. En gros c'est un fonctionnement dégradé pour les navigateurs qui ne parlent pas CSS. Si le css est bien analysé, l'image s'affiche. Sinon le texte.

c'est bon à savoir merci :jap:

FORUM HardWare.fr

Programmation

HTML/CSS

[XHTML + CSS] Utilisation de la property css background

Sujets relatifs
[XHTML CSS] Passer site de table en div	[Validation] Concilier les balises à la con de Flash avec du XHTML.
[CSS] chevauchement de divs	[XHTML] Validation XHTML et charset
[Html] Utilisation des positions absolues	CSS et passage de parametres
Tutoriels et exercices CSS	[CSS] @page
[Validation] XHTML 1.0 Transitional CSS, Omittag No et Background
Plus de sujets relatifs à : [XHTML + CSS] Utilisation de la property css background

Page générée en 0.051 secondes