Flux rss
Rechercher : dans
Par : Pertinence Date Nom d'utilisateur
Statut : Résolu

[CSS] hover pas sur tous les éléments

zzzer, le mercredi 23 juillet 2008 à 09:10:52
Bonjour,


J'ai un tableau HTML de la forme :
<table><tr><th>Titre 1<th>Titre 2
           <tr><td>Ligne 1<td>Ligne 1
           <tr><td>Ligne 2<td>Ligne 2
           <tr><td>Ligne 3<td>Ligne 3
</table>

Et j'ai ce CSS :
tr:hover{ background-color : yellow; }

Mais j'aimerais que seuls les lignes contenant des <td> puissent être mises en surbrillance, pas la première...
Comment faire ? Rajouter un ID à la première ligne et dire au CSS de ne pas colorer celle-ci ? Si oui, comment ?


Merci :)
Configuration: Windows 2000
Firefox 3.0.1
Répondre à zzzer  Signaler ce message aux modérateurs Aller au dernier message

1


  • 1
    Ce message vous semble utile, votez !
  • Ce message ne vous semble pas utile, votez !
  • Signaler ce message aux modérateurs
macgawel, le mercredi 23 juillet 2008 à 09:32:46
Bonjour.

Il suffit d'utiliser l'héritage :
tr:hover{ background-color : yellow; }

Tu demandes de mettre en jaune les TR qui sont survolés.

Ce que tu veux, c'est mettre en jaune tous les TD des TR qui sont survolés.
Les TR qui sont survolés => tr:hover
Tous les TD des TR qui sont survolés => tr:hover td

=>
tr:hover td { background-color : yellow; }


Ceci-dit, je ne suis pas sûr qu'un hover sur un tr soit valide, et je suis à peu près sûr que ça posera problème avec certains navigateurs...
Si tu donnes à celui qui a faim un poisson, tu le nourris pour un jour ;
si tu lui apprends à pêcher, tu le nourris pour toujours.
Répondre à macgawel

2


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
zzzer, le mercredi 23 juillet 2008 à 09:34:50
En effet, ça marche nickel (mais pas sous IE, qui ne supporte les hover que sur les <a>) !
Merci beaucoup ;)
Répondre à zzzer

3


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
Dalida, le mercredi 23 juillet 2008 à 09:57:22
salut,

comme tu as l'air d'aimer le code valide, je me permets…

c'est valide :
[...] La pseudo-classe :hover, qui est appliquée quand l'utilisateur désigne un élément</souligne> (au moyen d'un appareil de pointage) sans l'activer [...]
CSS ne définit pas lesquels des éléments peuvent être dans un de ces états ou comment ceux-ci entrent et sortent de ces états.


donc tous les éléments sont susceptibles d'utiliser {:hover;} mais IE n'est pas forcement blâmable :
<souligne>Les agents utilisateurs ne sont pas tenus, en raison des transitions provoquées par les pseudo-classes, de remettre en forme le document en cours d'affichage. Par exemple, une feuille de style peut spécifier que la taille de la police ('font-size') d'un lien sous l'effet de la pseudo-classe :active soit plus grande que celle d'un lien inactif, et un agent utilisateur, comme cela peut modifier la position des lettres, peut en ignorer la règle. 


Spécification CSS 2.1

et est-ce que quelqu'un à tester le {:hover} sous IE7 ?
[ Mathieu ]
Il y a surement des pandas pour ne dépendre de rien
Répondre à Dalida

4


  • Ce message vous semble utile, votez !
  • Signaler ce message aux modérateurs
 zzzer, le mercredi 23 juillet 2008 à 10:03:24
donc tous les éléments sont susceptibles d'utiliser {:hover;} mais IE n'est pas forcement blâmable
En effet...

est-ce que quelqu'un à tester le {:hover} sous IE7 ? 
Oui, il fonctionne avec les liens <a href> mais pas avec les autres éléments (quoi que, peut-être les images je crois).

N'oubliez pas de marquer la discussion comme résolue dès que c'est le cas ! -> En haut de la page, Statut: Résolu
Attention aussi à bien respecter la 6e règle de la charte : 
Rédiger les messages dans un langage clair sans abréviations, style télégraphique ou mode SMS
Répondre à zzzer
[JS] Simuler un hover sur <span> (Résolu)Salut J'aimerai simuler un effet 'lien' sur une balise ou . je m'explique : l'attribut CSS hover ne marche que sur la balise , or je souhaite faire en sorte que le survol de ma balise ou (span à... www.commentcamarche.net/forum/affich-2179233-js-simuler-un-hover-sur-span
Apparition d'une bulle (Résolu)Bonjour, j'aimerai savoir comment faire apparaitre une petit fenêtre avec un message quand on passe la souris sur un lien ou un bouton submit ? j'ai essayé avec un style CSS :hover sans succès merci d'avance cordialement kazou www.commentcamarche.net/forum/affich-7207607-apparition-d-une-bulle
CSS :hover (Résolu)Bonjour, je vous explique mon problème lié au css : j'ai un tableau du type blabla 1 blabla 2 blabla3 ..... .... Dans mon fichier css... www.commentcamarche.net/forum/affich-8443812-css-hover
Différence entre display:none et visibility:hiddenLes deux attributs CSS display:none et visibility:hidden permettent tous deux de masquer l'affichage d'un élément en CSS dans le navigateur. Néanmoins, il existe une subtile nuance : visibility: hidden rend le bloc concerné invisible.... www.commentcamarche.net/faq/sujet-7908-difference-entre-display-none-et-visibility-hidden
[Gimp][Retouche photo] Supprimer des éléments d'une imageL'outil de clonage est utile pour supprimer des éléments d'une photo. Par exemple pour éliminer quelqu'un d'une photo, supprimer un avion dans le ciel ou les défauts d'une photo. Cet outil est présent dans Photoshop mais également dans de nombreux... www.commentcamarche.net/faq/sujet-3228-gimp-retouche-photo-supprimer-des-elements-d-une-image
Changer l'aspect du curseur en CSSLa propriété cursor permet de changer l'aspect du curseur sur un élément d'une page web. Le client affichera automatiquement le curseur de son ordinateur qui correspond au type de curseur que vous aurez choisi. Exemples Liste des attributs... www.commentcamarche.net/faq/sujet-9119-changer-l-aspect-du-curseur-en-css
Javascript et balise selected (Résolu)Bonjour, Ma question est la suivante : comment faire pour permettre a la balise select qui ce trouve dans la page index.php de modifier plusieurs balise select qui se trouve sur des formulaire different et dans la page page2.php Merci d avance de... www.commentcamarche.net/forum/affich-3679014-javascript-et-balise-selected
XHTML CSS et a:hover + img (Résolu)Bonjour, Dans mon css, j'ai mis: a:hover { color : #ffffff; text-decoration : none; background-color : #4c0000; font-style : normal; } Ce qui signifie que le lien aura un background plutot rouge (4c0000). Mais dans la ban j'ai voulu mettre... www.commentcamarche.net/forum/affich-3071282-xhtml-css-et-a-hover-img
[JAVASCRIPT-DOM] propriété classe CSS (Résolu)bonjour, je dois recuperer la propriété de style d'un élément html, cette propriété est contenue dans une feuille de style .css qui est contenu dans une classe css. si la propriété est declarée dans la balise avec l'attribut... www.commentcamarche.net/forum/affich-1620003-javascript-dom-propriete-classe-css
Adobe Adobe Acrobat Elements - (version 7.0 ) - supportAdobe Adobe Acrobat Elements - (version 7.0 ) - support,,CD-ROM supplémentaire pour "Acrobat Elements" version 7.0, Français, Windows, réservé aux possesseurs de licences www.commentcamarche.net/guide-achat/adobe-adobe-acrobat-elements-version-7-0-support-434037580-fiche-technique
ADOBE PHOTOSHOP ELEMENTS 6ADOBE PHOTOSHOP ELEMENTS 6,,Retouchez vos photos / Partagez vos pages d'albums via le Web / Personnalisez vos albums photos. Disponibilité: Expédié sous 24h www.commentcamarche.net/guide-achat/adobe-photoshop-elements-6-451683239-fiche-technique
CSS - Syntaxe des styles La définition d'un style se fait à l'aide de règles en texte simple permettant de décrire l'aspect des éléments de la page. Une règle CSS est caractérisée par deux principaux éléments : Un sélecteur de balises, permettant de préciser à quelles... www.commentcamarche.net/css/csssyntax.php3
CSS - Les unités Les balises DIV définissent des blocs d'éléments. Il s'agit d'une structure privilégiée pour définir des boîtes telles que des menus ou des encarts. Le standard CSS propose un certain nombre de propriétés permettant de contrôler précisément les... www.commentcamarche.net/css/css-bordures-boites.php3
CSS - Les classes de style Il peut s'avérer intéressant d'affecter des styles différents à des mêmes balises. Pour cela les spécifications CSS ont introduit le concept de classe. La définition des classes est aussi simple que celles des styles. Elle consiste à préciser la... www.commentcamarche.net/css/cssclass.php3
Toutes les réponses pour « [CSS] hover pas sur tous les éléments »