Menu

Balise <img> css [Résolu]

-
Bonjour,

J'utilise actuellement l'attribut caption dans mes balises <img> sous la forme suivante mais suite à une analyse W3C on m'indique que c'est une erreur. Comment puis je faire la même chose que ce code sans cet attribut caption :

Code html
<div id="CHIOT">
<aside class="AsideParents">
            <figure>
                <img src="*.jpg" alt="Nausicaa" caption ="MAMAN"/>
         </figure>
        </aside>
<aside class="AsideParents">
            <figure>
                <img src="*.jpg" alt="Ice" caption ="PAPA"/>
            </figure>
        </aside>
</div>


Code CSS

 #CHIOT .AsideParents
  {
  display: inline-block;
  width: 35%;
  max-height: 350px;
  min-width: 190px;
  margin: 0;
  }
 #CHIOT img[caption ="PAPA"]
  {
  border: 2px turquoise outset;
  border-radius: 5px;
  min-width: 100px;
  text-align:center;
  height: 200px;
  width: 200px;
  vertical-align: middle;
  }
 #CHIOT img[caption ="MAMAN"]
  {
  border: 2px Fuchsia outset;
  border-radius: 5px;
  min-width: 100px;
  text-align:center;
  height: 200px;
  width: 200px;
  vertical-align: middle;
  }


EDIT : Ajout des balises de code (la coloration syntaxique).
Explications disponibles ici : ICI

Merci d'y penser dans tes prochains messages.


Merci d'y penser dans tes prochains messages.
Afficher la suite 

Votre réponse

1 réponse

Meilleure réponse
Messages postés
25247
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 avril 2019
1952
1
Merci
Bonjour,
https://www.w3schools.com/tags/tag_figcaption.asp

Dire « Merci » 1

Heureux de vous avoir aidé ! Vous nous appréciez ? Donnez votre avis sur nous ! Evaluez CommentCaMarche

CCM 40432 internautes nous ont dit merci ce mois-ci

Si j'uitilise la balise <figcaption> comme dans l'exemple présenté le texte entre la balise va apparaître .
Dans mon code les caption "PAPA" ou "MAMAN" n'apparaissent pas sur le site ils ne me servent qu'à donner le style d'encadrement de l'image.
jordane45
Messages postés
25247
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
22 avril 2019
1952 > Wyzern -
et bien.. si c'est juste pour jouer sur le css ... utilise des CLASS
Si je vous comprends bien il faudrait que je code de cette façon et c'est validé par les règles W3C ?


Code html :
<div id="CHIOT">
<aside class="AsideParents">
<figure>
<img class=MAMAN src="*.jpg" alt="Nausicaa" />
</figure>
</aside>
<aside class="AsideParents">
<figure>
<img class=PAPA src="*.jpg" alt="Ice" />
</figure>
</aside>
</div>

Code CSS


#CHIOT .AsideParents
{
display: inline-block;
width: 35%;
max-height: 350px;
min-width: 190px;
margin: 0;
}
#CHIOT img.PAPA
{
border: 2px turquoise outset;
border-radius: 5px;
min-width: 100px;
text-align:center;
height: 200px;
width: 200px;
vertical-align: middle;
}
#CHIOT img.MAMAN
{
border: 2px Fuchsia outset;
border-radius: 5px;
min-width: 100px;
text-align:center;
height: 200px;
width: 200px;
vertical-align: middle;
}
Commenter la réponse de jordane45