Déclaration de background multiple
Bonjour à tous,
je commence à utiliser avec bonheur le CSS3 et la possibilité d'utiliser plusieurs images en fond.
Par exemple
Code:
background: url('../../images/contenuh3degrad.png') repeat-x left top, url('../../images/contenuh3g.png') no-repeat left top, url('../../images/contenuh3d.png') no-repeat right top;
Mais peut-on appliquer des images en les déclarant à des endroits différents ?
Par exemple j'aimerai appliquer un style à tous mes h4 dans ma section outils dans une feuille de style:
Code:
1
2
3
4
5
| #outils h4{
padding:10px 6px 4px 6px;
margin:0px 0px 3px 0px;
background: url('../../images/contenuh3degrad.png') repeat-x left bottom;
} |
puis appliquer une deuxième image spécifique à chaque h4:
Code:
<h4 style="background:url('../../images/outils-sommaire.png') no-repeat right top;">Mon Titre</h4>
mais là le style intraligne remplace la déclaration de la feuille de style (ce qui est normal) et donc la seule image qui s'affiche est outils-sommaire.png.
Si je dois faire une classe par type de h4 pour y incorporer les 2 images à la fois ça va être lourd (plein de classes) et encore pire pour de futures évolution si je déclare les styles en intraligne !
Auriez-vous une solution ?
Merci
et question annexe : existe-t-il un moyen de spécifier une "base href" comme en html dans une feuille de style ?
Genre comme on déclare le charset de la feuille de style, on pourrait mettre
Code:
base-href=http://site.com
.
Ce serait pour faciliter le transfert local/serveur en gardant des URL d'images non relatives
