catégorie définie à l'intérieur h1 ne répond pas aux feuilles de style css

Je suis en utilisant la boîte à outils d'un thème pour wordpress. C'est le code utilisé pour afficher le titre de chaque post sur la page de blog à l'intérieur d'une balise h1

<h1 class="entry-title"><a href="<?php t he_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'toolbox' ), the_title_attribute( 'echo=0' ) ); ?>" ><?php     the_title(); ?></a></h1>

Il affiche les titres correctement sur la page, mais lorsque j'essaie de modifier l'apparence de ces titres en utilisant le css, il n'y a pas de changement, la couleur reste toujours bleu:

.entry-title {color:#000;}

Il y a un étrange bleu soulignement sous le titre trop, j'aimerais également que, pour être enlevés.

Voici la sortie html de la page:

<header class="entry-header">
<h1 class="entry-title">
<a rel="bookmark" title="Permalink to Haley Joel Osment to Try Acting As a Grown Up in New…" href="http://localhost/wordpress/featured/haley-joel-osment-to-try-acting-as-a-grown-up-in-new-6/">Haley Joel Osment to Try Acting As a Grown Up in New…</a>
</h1>
<div class="entry-meta">
</header>
InformationsquelleAutor m.umar | 2011-07-24
  1. 2

    La déclaration de classe .entry-title n'affecte pas les liens au sein de la h1 élément.
    Si vous souhaitez aborder les liens à l'intérieur de la h1 élément, vous devez utiliser le sélecteur de h1.entry-title a.

    Exemple, pour supprimer le soulignement et définissez la couleur de manière explicite:

    h1.entry-title a { text-decoration:none; color:red; }

    PS: Dans ce contexte, le préfixe h1. peut être facultatif, mais il offre une plus spécifique de différenciation.

    • cela semble avoir fait le tour. Merci!!!!
    • Il n'affecte pas les liens, "pas d'effet" en les liens. Aussi, h1.entry-title a n'est pas une "classe", c'est un sélecteur CSS.
    • Je suppose que vous voulez dire "Elle n'affecte pas les liens, pas d'effet sur les liens"? Mais vous avez raison, mon moche choisi phrases pourrait causer de la confusion. Merci pour la correction.
    • ne peux pas commenter votre réponse encore en raison du manque de réputation): Votre réponse ne considère pas le h1-préfixe. Si votre sélection ne prendra pas effet si quelque part d'autre dans le style le sélecteur h1.entry-title a est défini, parce que ce serait de remplacer vos styles.
    InformationsquelleAutor Christopher Will
  2. 2

    Si vous avez un <a> au sein d'une <h1> tag et le style de l' <h1>, le <a> utilisera héritées de style et ne peut pas suivre le style de la <h1.

    Peut-être que vous pourriez juste le style de la <a> éléments au sein de .entry-title:

    .entry-title a{
//styles
}

    Si elle ne répond toujours pas, il est possible qu'il y est un problème de spécificité, dans ce cas, vous souhaitez utiliser !important sur le .entry-title style.

    MODIFIER
    Pour supprimer la ligne bleue de dessous le lien sur le vol stationnaire, vous aurez probablement envie de supprimer le lien de texte décoration:

    .entry-title a:hover{
    text-decoration:none;
    //other styles
}
    InformationsquelleAutor element119
  3. 1

    Le problème ici est que le navigateur mettra du style par défaut sur le <a> à l'intérieur de la <h1> pour des raisons d'accessibilité et peut-être quelque chose d'autre.

    Idéalement, le <a> devrait aller à l'extérieur de la <h1>, comme ceci:

    <a href="<?php t he_permalink(); ?>" title="<?php printf( esc_attr__( 'Permalink to %s', 'toolbox' ), the_title_attribute( 'echo=0' ) ); ?>" >
    <h1 class="entry-title"><?php the_title(); ?></h1>
</a>
    • Qui est valide seulement de balisage avec un doctype HTML5.
    InformationsquelleAutor Bojangles
  4. 0

    Sonne comme il y a une autre règle avec plus de spécificité qui est primordial à la règle. Ajouter un !important à votre règle (.entry-title {color:#000 !important;}) ou de changer le sélecteur (la .entry-title) de la partie pour avoir une plus grande la spécificité.

    Par exemple, avec Chrome, vous pouvez Inspecter l'élément en cliquant-droit sur l'élément et en sélectionnant Inspecter l'élément dans le menu contextuel. Vous devriez être capable de voir ce que les autres règles CSS sont appliquées à votre élément qui permettra de suivre ce que d'une règle peut s'appliquer à l'élément et dominante de votre style. La plupart des autres navigateurs modernes disposent d'une semblable outil de développement pour l'inspection de HTML, CSS et JavaScript.

    • Si vous en bas de voter une réponse sans un commentaire vous n'êtes pas aider du tout.
    • Merci à Vous tous pour toutes les ur réponses, Christopher réponse a fait l'affaire pour moi!
    • Si vous prenez un coup d'oeil à ma réponse, vous verrez que c'est le même que Christophe, sauf que j'ai expliqué pourquoi il fonctionne.
    InformationsquelleAutor andyb