Quatre mots-clés

body {
  font-family: system-ui, sans-serif;
}

/* font-weight est une propriété héritée */
.sobre {
  font-weight: normal;
}

.sobre strong {
  font-weight: 900;
}

.sobre .s-inherit {
  font-weight: inherit;
}

.sobre .s-initial {
  font-weight: initial;
}

.sobre .s-unset {
  font-weight: unset;
}

.sobre .s-revert {
  font-weight: revert;
}

/* border n'est pas une propriété héritée */
.sans-cadre {
  border: 3px dotted #1f3a68;
}

.sans-cadre fieldset {
  border: 1px solid #e07a1f;
}

.sans-cadre .f-inherit {
  border: inherit;
}

.sans-cadre .f-initial {
  border: initial;
}

.sans-cadre .f-unset {
  border: unset;
}

.sans-cadre .f-revert {
  border: revert;
}

Le paragraphe sobre contient quatre <strong> (classes s-inherit à s-revert) ; le formulaire sans-cadre contient quatre <fieldset> (classes f-inherit à f-revert).

• Donner la graisse (font-weight) de chaque <strong>, sachant que la feuille du navigateur leur donne bold (700) et que normal vaut 400.
• Donner la bordure de chaque <fieldset>, sachant que la feuille du navigateur leur donne un cadre gris en relief de 2 pixels.
• Pourquoi a-t-on écrit .sobre .s-inherit et non simplement .s-inherit ?