TD2

À quoi correspond rgb(120, 56, 13) en hexadécimal ?

RGB(120, 56, 13) correspond à #78380d en héxadécimal.

Combien de couleurs chacune de ces trois méthodes (rgb, hexa ou nom de couleur) vous permettent d'obtenir ?

Il y 255 nuances de chacunes des 3 couleurs donc il faut faire: 256x256x256= 16777216. Donc il y a 16777216 couleurs possible.

Comparez en quelques lignes ces méthodes (avantages/inconvénients).

La méthode RGB rdt bien car elle permet d'avoir des couleurs précises mais l'inconvenient c'est qu'il faut chercher à tatons quel est le code pour la couleur cherchée. Pour la méthode hexa, il faut connaître le nom de la couleur cherchée pour pouvoir trouver le code hexa correspondant. La méthode nom de couleur est assez simple, il suffit de connaître la couleur cherchée, de taper son nom dans la ligne de code et la base de donnée Brackets se chargera de mettre la couleur.

Combien cet arbre a-t-il de nœuds de type ELEMENT ? De type TEXT ?

Cet arbre a 16 noeuds de type elements et 13 noeuds de type text.

Écrire le code HTML correspondant à ce DOM.

Lien

Quel code CSS peut-on écrire pour, sans toucher au code HTML (pas de classe ou d'identifiant !), mettre un fond rouge à « châtaignes » et un fond cyan à « couverture » ?

Préparatifs pour l'hiver

  • Prévoir :
    • du pain
    • du chocolat
    • des oranges
    • quelques châtaignes
  • une bonne couverture

ul li ul li:last-child em{background-color: red;}

li:last-child em{background-color: cyan;}

Proposez une feuille de style qui attribue une couleur différent aux liens selon qu'il s'agisse :

a[href*="mailto"] {color: rebeccapurple;}

MAIL

a[href^="#"] {background-color: gold;}

a[href*="http"] {color: rebeccapurple;}

Quelle est la différence entre p:hover et p :hover ?

"p:hover" sert à changer la couleur des paragraphes lorsqu'on les survole avec la souris alors que "p :hover" sert à changer la couleur des éléments fils d'un paragraphe lorsqu'on les survole avec la souris.

Modifiez votre feuille de style pour que, pour chaque citation, il y ait des guillemets colorés avant et après la citation.

blockquote::after{content: '>>'; color: gold;}

blockquote::before{content: '>>''; color: gold;}

Profitez-en pour appliquer un fond coloré à chaque citation.

blockquote{background-color: fuchsia;}

Quelle sera la couleur des différents éléments de cette page ?

Le H1 sera en brown. 'Ceci est un paragraphe' sera en violet. 'assez remarquable' sera en brown. 'Et que dire de celui-ci ?' sera en bleu.

Classez-les de la plus forte à la faible, en justifiant.

#intro a la plus forte priorité

"p.important" puisqu'il correspond aux paragraphes avec comme classe "important".

"body .important" puisqui'il correspond à tous les éléments descendants de "body" et ayant pour classe "important".

"p" puisqu'il correspond à tous les paragraphes.

Puis c'est le "body" puisqu'il correspond à tous les éléments du body.

L'élément qui a la moins forte priorité est "*" puisqu'il correspond à tous les éléments de la page.