Le titre réécrit est : Modifiez le titre de la liste en réponse au déplacement du curseur vers l'élément de la liste.
<p>Je crée un tableau lié et je souhaite le rendre plus joli en modifiant la couleur d'arrière-plan de l'en-tête du tableau lorsque je déplace ma souris sur l'un des liens de la liste. Cependant, je ne sais pas comment modifier les propriétés d'un élément conteneur en affectant ses éléments plus petits. Voici mon code : </p>
<pre class="brush:php;toolbar:false;"><html lang="vi">
<tête>
<style>
.toc-conteneur {
largeur maximale : 600 px ;
famille de polices : "Roboto", sans empattement ;
arrière-plan : #deff9d ;
rayon de bordure : 8 px ;
box-shadow : 0 4px 11px rgba(0, 0, 0, 0.6);
}
.toc-conteneur h2.index-titre {
transformation de texte : majuscule ;
poids de la police : normal ;
marge : 0 16px ;
rembourrage supérieur : 16 px ;
}
.table des matières {
style de liste : aucun ;
remplissage : 0 ;
}
.table des matières li.auteur li.blog {
arrière-plan : #222 ;
transition : 400 ms ;
style de liste : aucun ;
}
.table des matières li.auteur{
couleur de fond : vert ;
}
.table des matières li.auteur li:ntième-de-type(même).blog {
arrière-plan : #2e2e2e ;
}
.table des matières li.auteur li:hover.blog {
arrière-plan : #000 ;
}
.table des matières li a {
décoration de texte : aucune ;
couleur : #fff ;
marge gauche : 24 px ;
remplissage : 16px 0 ;
bloc de visualisation;
}
</style>
≪/tête>
<corps>
<div class="toc-container">
<h2 class="index-heading">heading</h2>
<ul class="table-des-matières">
<li class="auteur">
<a href="#">Nom de l'auteur</a>
<ul>
<li class="blog">
<a href="#">Nháp 1</a>
≪/li>
</ul>
≪/li>
</ul>
</div>
</corps>
</html></pre>
