- Statut : non résolu
- Ce sujet contient 1 réponse, 2 participants et a été mis à jour pour la dernière fois par
Lumiere de Lune, le il y a 11 années et 11 mois.
-
AuteurMessages
-
30 décembre 2011 à 22 h 18 min #503670
Bonjour,
Voilà mon problème. La semaine dernière, j’ai découvert cet excellent article afin d’encadrer les images de mon blogue avec style. Tout marche maintenant à la perfection de ce côté.
Mon objectif maintenant est de développer un autre style d’encadrement pour les images à la Une introduisant mes articles. En effet, puisque la page d’accueil de mon thème s’appuie beaucoup sur cette image pour intéresser les internautes (je me force à chaque article pour développer des images sur mesure), je cherche donc à visuellement « incruster » l’encadrement de cette image (qui sera bleu pâle) avec l’onglet dans lequel s’y retrouve le titre de l’article. le concept du design est ainsi de suggérer cette image comme un genre de fiche virtuelle menant à l’article.
Par ailleurs, l’autre objectif et de pouvoir me servir du caption afin d’y d’insérer encore plus d’information dans l’image afin de maximiser le référencement à l’article qui lui est lié 😉
En suivant donc cet objectif, j’ai ainsi découvert cet autre article nous expliquant comment définir un style d’encadrement distinct pour les images. L’option est intéressante, mais malheureusement, du moment que je rajoute une légende sous l’image en question, c’est le style par défaut du caption qui s’impose. A titre d’exemple, je laisse ici à votre attention cet article avec le problème en question. En effet, vous pourrez y remarquer que l’encadrement y est gris (style du caption par défaut) plutôt que bleu pâle tel que j’ai définis dans le style distinct: « article_image «
Alors, voilà mon problème est ma question. Comment pourrais-je définir un deuxième caption style dans ma feuille CSS?
Je vous laisse ci-joint le code de mon deuxième style… il me suffit maintenant, je pense, juste d’y définir un autre caption style… si l’option est possible.
img.article_image {
display: block;
background: #e9f2f8;
padding: 6px;
border: solid 1px #d6d6d6;
}
a.article_image, a.article_image:link, a.article_image:visited {
background: #e9f2f8;
padding: 6px;
border: solid 1px #d6d6d6;
text-align: center;
display: block;
}
a.article_image:hover, a.article_image:active {
background: #ddd;
}
a.article_image img {
display: inline;
border: none;
border: solid 1px #d6d6d6;
}Merci beaucoup pour l’attention et bonne année encore à la communauté WordPress :wp:
2 janvier 2012 à 22 h 57 min #808077Les css s’appellent « cascading style sheet », donc en utilisant la « cascade », en définissant un deuxième style plus précis (avec par exemple l’id du conteneur)
exemple général
.caption est une classe qui s’applique partout
#frontpage .caption est une classe qui ne s’applique qu’à l’intérieur d’un conteneur ayant comme id « frontpage »Un petit coup de firebug pour firefox te permettra de définir les bons conteneurs
-
AuteurMessages
- Vous devez être connecté pour répondre à ce sujet.