Classe CSS IMG à l'intérieur de la div et span

Hi début j'ai un code comme ceci:

<div class="123_test" tabindex="0" role="button">

    <span class="">
        <img class="" alt="" src="picturetopic"></img>        
    </span>
</div>

Comment puis-je style de cette img avec 123_test classe?

Tu veux dire .123_test > img{ style of the image } ?
img n'est pas directement décroissant de div.123_test. Ne devrait-elle pas être div.123_test>span>img ??

OriginalL'auteur Paweł Domański | 2013-10-14

  1. 16

    Tout d'abord vous ne pouvez pas démarrer un nom de classe à l'aide d'un chiffre, je suppose que c'est de générer à partir de quelque part que les classes sont vides, mais si vous le pouvez, que d'envisager de la changer, comme

    class="name_123_test"

    Et utilisez le sélecteur ci-dessous comme

    .name_123_test > span img {
   /* Styles goes here */
}

    Dans le CSS, les identifiants (y compris les noms d'élément, les classes et les Id dans
    sélecteurs) peut contenir que les caractères [a-zA-Z0-9] et ISO 10646
    les caractères U+00A0 et plus, plus le trait d'union (-) et le trait de soulignement
    (_); ils ne peuvent pas commencer par un chiffre, deux traits d'union, ou d'un tiret suivi
    par un chiffre. Les identificateurs peuvent également contenir des caractères d'échappement et tout
    L'ISO 10646 personnage comme un code numérique (voir point suivant). Par exemple,
    l'identificateur "B&W?" peut être écrit "B\&W\?" ou "B\26 W\3F".

    W3C Référence

    OriginalL'auteur Mr. Alien

  2. 2

    Pourquoi votre class attributs vides?

    Si vous souhaitez appliquer le 123_test classe à la img balise, il suffit de l'ajouter dans le class attribut:

    <img class="123_test" alt="" src="picturetopic"></img>

    Ou voulez-vous dire que vous souhaitez utiliser l'ancêtre div comme un guide de style pour les img? Dans votre CSS, vous pouvez faire référence à la img comme un descendant de la 123_test classe:

    .123_test img
{
    //css rules
}

    L'espace entre les deux identifiants signifie que ce dernier est un descendant de l'ancien.

    Je suis d'accord, si vous pouvez spécifier un nom de classe à l'image elle-même qui serait la bonne. Votre deuxième exemple de répondre à des scénarios où les images sont générées dynamiquement à partir de la 3ème partie & si le consommateur n'a pas la possibilité de spécifier les noms de classe css

    OriginalL'auteur David

  3. 0

    Vous ne pouvez pas le nom d'une classe commence avec un numéro. Afin de changer votre nom de la classe à class="test_123" ou quelque chose qui ne commence pas par un nombre.

    Et maintenant, vous pouvez définir le style de votre img:

    .test_123 //here you put your class name after the "."
{
    //style your image here
}

    OriginalL'auteur Roman

  4. 0

    En outre, une meilleure utilisation des balises HTML pour la fonctionnalité:

    <button type="button" class="test_123" tabindex="0">    
    <span>
        <img alt="" src="picturetopic" />       
    </span>
</button>

    Boutons de type="button" peut contenir du texte ou une image. Si l'image contient du texte, il serait préférable d'utiliser le css pour créer l'effet graphique de la conformité w/lignes directrices sur l'accessibilité et l'affichage à travers de multiples dispositifs.

    OriginalL'auteur Roralee