Discussion :

[pataluc]

Bonjour,

je cherche un sélecteur CSS qui me permette de sélectionner les balises a ne contenant pas d'image...

je m'explique, j'utilise (sous firefox) l'extension stylish qui me permet de rajouter des styles aux pages que je visite. j'ai un script qui me permet d'afficher une enveloppe apres les adresses mails:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
a[href^="mailto:"]:after {
  content: url("data:image/png;base64,iVBORw0K...K5CYII=");
  padding-left:4px;
}

et je voudrais faire en sorte que ce style ne s'applique pas au blaise qui contiennent déja une image... j'ai essayé avec le sélecteur :not() mais je n'ai pas réussit a obtenir ce que je voulais; et de même je ne vois pas où je peux aller avec les sélecteur du type child, ni même en faisant un truc du genre

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
a[href^="mailto:"]:after img {
  content:none;
}

car ce style s'applique du coup a la balise img et non a...


qqun aurait il une idée de la bonne méthode pour ce que je cherche à faire? (je précise que vu que c'est pour une extension sous FF, je me moque de la compatibilité IE...)

Merci bcp,

Luc

[arnobase]

Dans la meme logique ne serait-ce pas

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
a[href^="mailto:"][img]:after {
  content:none;
}

[pataluc]

Dans la meme logique ne serait-ce pas

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
 
a[href^="mailto:"][img]:after {
  content:none;
}

il me semble que la notation [] est pour les attributs, alors que la c'est une balise fille... j'ai eu un faux espoir en croyant que ca marchait, mais en fait ca ne me met plus du tout mon contenu...

[arnobase]

j'avais compris de traviole ce que tu voulais désolé... je vois pas mieux en fait

[pataluc]

je re-précise un peu ce que je veux faire...

grâce a ce code et au sélecteur ":after", j'obtiens ce résultat:




mais le problème, c que qd un site a déja une img, ca fait pas jojo:





j'espere que ca peut aider... ^^

merci,
Luc

[Bisûnûrs]

Tu n'as qu'à utiliser des classes pour tes liens.

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
<a href="mailto" class="mailtotexte">Texte</a>
<a href="mailto" class="mailtoimg"><img .. /></a>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
a.mailtotexte:after {
  content: url("data:image/png;base64,iVBORw0K...K5CYII=");
  padding-left:4px;
}

[pataluc]

Tu n'as qu'à utiliser des classes pour tes liens.

en fait c'est pour un style chargé par Stylish qqusoit les pages que je visite, ce n'est pas pour un site que je développe. Je ne peux donc agir sur les classes...

[MasterOfChakhaL]

salut,

Je ne pense pas que ce soit possible directement en css.
Cela dit, je n'ai pas essayé mais p'tet qu'en bidouillant un peu tu peux arriver a quelque chose.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
a[href^="mailto:"]:after {
  content: url("data:image/png;base64,iVBORw0K...K5CYII=");
  padding-left:4px;
}

Comme tu l'as déjà fait, ca te permet d'ajouter l'image...
Ensuite, il faut masquer l'image que tu ajoutes quand une image et présente.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
a[href^="mailto:"] img {
  margin-right: -largeur de l'image et du padding-left;
}

Si l'image du lien a déjà un margin, ca ne va pas le faire mais bon...
Il te faudra aussi jouer avec les z-index je pense.