+ Répondre à la discussion Actualité déjà publiée
  1. #1
    Rédacteur

    Homme Profil pro
    Responsable de projet
    Inscrit en
    mai 2009
    Messages
    634
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 38
    Localisation : France

    Informations professionnelles :
    Activité : Responsable de projet
    Secteur : High Tech - Multimédia et Internet

    Informations forums :
    Inscription : mai 2009
    Messages : 634
    Points : 3 614
    Points
    3 614

    Par défaut Comprendre les couleurs en CSS3

    Bonsoir à tous,

    Voici un article pour comprendre les nouveautés au niveau des couleurs en CSS3 :

    Comprendre les couleurs en CSS3

    Bonne lecture!

    N'hésitez pas à faire part de vos remarques, questions et encouragements à la suite de ce message.

    Merci.

  2. #2
    Expert éminent
    Avatar de Auteur
    Profil pro
    Inscrit en
    avril 2004
    Messages
    6 706
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : avril 2004
    Messages : 6 706
    Points : 9 053
    Points
    9 053

    Par défaut

    bonjour,

    petite erreur dans le code CSS écrit dans l'article du II-Couleur HSL :
    Code css : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    	p.hslAutre{
    		background-color:hsl(100, 100%, 50%);
    		color:hsl(250, 100%, 25%);// couleur plus sombre que la précédente
    	}
    les commentaires en CSS s'écrivent entre /* et */
    J'ai vérifié dans la demo, tu utilises bien les /* et */ pour les commentaires.



    en IV-Couleur RGBA
    L'intérêt du rgba et du hsla vient du fait que l'opacité qu'il applique aux élements, n'est pas héritée par les enfants de ces éléments (c'est le cas pour opacity).
    Tu peux détailler ?

    Si je reprends ton exemple :
    Code css : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
     
    p.rgbaAutre{
    		background-color:rgba(90, 100, 50, 0.5);
    		color:rgba(250, 100, 50, 0.4);
    	}

    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
     
    <p class="rgbaAutre"> couleurs gérées en rgba 
    <span>coucou</span>
    bonjour tout le monde !
    </p>
    en ajoutant un <span> dans <p>... Donc normalement si j'ai bien compris le span ne prend pas la couleur définie dans le CSS, c'est bien ça ("coucou" est écrit en noir sur fond blanc) ?

  3. #3
    Membre éprouvé Avatar de sebhm
    Homme Profil pro
    Développeur Web
    Inscrit en
    avril 2004
    Messages
    1 089
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 36
    Localisation : France, Landes (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : Agroalimentaire - Agriculture

    Informations forums :
    Inscription : avril 2004
    Messages : 1 089
    Points : 1 279
    Points
    1 279

    Par défaut

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    p.hsla{
            background-color:hsl(100, 100%, 50%, 0.8);
            color:hsl(250, 100%, 50%, 0.5);
        }
        p.hslaAutre{
            background-color:hsla(90, 100%, 50%, 0.5);
            color:hsla(250, 100%, 50%, 1.0);
        }
    manque pas les a de hsla dans la premiere declaration ?

  4. #4
    Membre éclairé Avatar de c_s_s
    Profil pro
    Inscrit en
    juillet 2008
    Messages
    619
    Détails du profil
    Informations personnelles :
    Localisation : France, Paris (Île de France)

    Informations forums :
    Inscription : juillet 2008
    Messages : 619
    Points : 747
    Points
    747

    Par défaut

    L'intérêt du rgba et du hsla vient du fait que l'opacité qu'il applique aux élements, n'est pas héritée par les enfants de ces éléments (c'est le cas pour opacity).
    en ajoutant un <span> dans <p>... Donc normalement si j'ai bien compris le span ne prend pas la couleur définie dans le CSS, c'est bien ça ("coucou" est écrit en noir sur fond blanc) ?
    En fait, il faudrait préciser que l'opacité n'est pas héritée par les enfants si on leur applique un/des style(s).

    Si tu n'appliques aucune propriété au span, il héritera des propriétés du paragraphe, opacité comprise.
    Si tu appliques une couleur sur le texte du span, alors il n'héritera pas de l'opacité de la couleur du texte du paragraphe et sa couleur de texte sera "pleine".
    Idem pour la couleur de fond.

Discussions similaires

  1. alterner les couleurs dans un tableau avec xsl
    Par Eithelgul dans le forum XSL/XSLT/XPATH
    Réponses: 14
    Dernier message: 03/05/2015, 23h29
  2. Comprendre les couleurs en CSS3
    Par ornitho13 dans le forum Mise en page CSS
    Réponses: 3
    Dernier message: 28/09/2010, 10h38
  3. Changer les couleurs de la palette avec du RGB
    Par le mage tophinus dans le forum x86 16-bits
    Réponses: 11
    Dernier message: 13/01/2003, 08h55
  4. Question sur les handles et les couleurs...
    Par MrDuChnok dans le forum C++Builder
    Réponses: 7
    Dernier message: 29/10/2002, 08h45

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo