28220 sujets

CSS et mise en forme, CSS3

Width d'un background-color ?

Salut tous le monde,

Je voulais savoir si il est possible de donner une dimension à son background-color ou à une background-image.

Par exemple, mon div fait width: 200px; sa je veux qu'il reste à 200, mais le background-color ou -image ne fait que 25px;

Il y aura une partie de mon div qui aura la couleur ou l'image du background et le reste sera la couleure par défaut.

Je ne sais pas si c'est possible mais si vous savez sa serait gentil Smiley smile

Merci d'avance
bonjour,

dans le cas ou ton div a un width de 200px et que tu veux lui appliquer une couleur, tu devrais ecrire
#machin {
width: 200px;
background: #(ta couleur);
}


dans le cas ou tu veux lui appliquer une image qui a un width de 25px alors,

#machin {
width: 200px;
background: transparent url( ton image.jpg)  left repeat y;
}


mais ton image sera alors repeter x fois pour combler le div de 200px;
Modifié par Philippe (30 Nov 2005 - 15:41)
En fait, je voudrai pouvoir choisir le 25px depuis CSS.

car il s'agit d'un compteur, ou y a t'il un moyen de placer un div en dessous de l'arrière plan actuel ?

Bien que le code soit faux :

background-color: #000000 left repeat-y 5px;


Permet de mieux voir se que je veux faire ^^

Mettre un fond noir depuis la gauche de 5px.
Modifié par Mikiman (30 Nov 2005 - 15:52)
Bonjour,

L'étendue d'une image peut être facilement gérée avec la propriété background grâce aux valeurs type top, left et repeat.

Mais une couleur s'étend obligatoirement à la totalité de la surface de contenu et de padding du bloc.

Pour peindre une partie de la surface seulement avec une couleur, il faut lui appliquer une image d'arrière plan de la couleur en question, de la largeur de cette partie, d'un pixel de hauteur, répétée verticalement ou horizontalement.
Modifié par Laurent Denis (30 Nov 2005 - 16:14)
Si on veut un arrière-plan jaune sur 25px de large côté gauche et le reste de la couleur par défaut (disons du blanc) :
- faire une image bg.png toute en jaune de 25x1 px
- ajouter pour l'élément concerné la propriété :

#foo {
background: #fff url(bg.png) left top repeat-y;
}


#fff = couleur blanc partout où l'image n'apparaît pas
left top = image placée en haut à gauche
repeat-y = image répétée depuis cette position sur toute la hauteur
Modifié par Laurent Denis (30 Nov 2005 - 16:25)
Le truc c'est que je veux que sa puisse être modifiable depuis le Css, car il s'agit d'un compteur qui fait varier le % de couleur par rapport a la donnée du compteur
aïe Smiley cligne

C'est une sorte d'histogramme ou de graphique en barre ?

Dans ce cas, oublier immédiatement CSS qui n'est pas du tout fait pour ça. Ce graphique n'est pas de la déco, mais du contenu.

Utiliser une libraire PHP ou équivalent générant une image à la volée (avec mise en cache serveur si nécessaire) dotée d'équivalent textuels alt="la valeur numérique représentée".
Modifié par Laurent Denis (30 Nov 2005 - 16:36)
Sujet clos
Aller à