Der umgeschriebene Titel lautet: Ändern Sie den Listentitel als Reaktion darauf, dass sich der Cursor zum Listenelement bewegt
<p>Ich erstelle eine verknüpfte Tabelle und möchte die Tabelle schöner gestalten, indem ich die Hintergrundfarbe der Tabellenüberschrift ändere, wenn ich meine Maus über einen der Listenlinks bewege. Ich weiß jedoch nicht, wie ich die Eigenschaften eines Containerelements ändern kann, indem ich seine kleineren Elemente beeinflusse. Das ist mein Code: </p>
<pre class="brush:php;toolbar:false;"><html lang="vi">
<Kopf>
<Stil>
.toc-container {
maximale Breite: 600 Pixel;
Schriftfamilie: „Roboto“, serifenlos;
Hintergrund: #deff9d;
Randradius: 8px;
Box-Shadow: 0 4px 11px rgba(0, 0, 0, 0,6);
}
.toc-container h2.index-heading {
Texttransformation: Großbuchstaben;
Schriftstärke: normal;
Rand: 0 16px;
Polsterung oben: 16px;
}
.Inhaltsverzeichnis {
Listenstil: keiner;
Polsterung: 0;
}
.Inhaltsverzeichnis li.Autor li.blog {
Hintergrund: #222;
Übergang: 400 ms;
Listenstil: keiner;
}
.Inhaltsverzeichnis li.author{
Hintergrundfarbe: grün;
}
.table-of-contents li.author li:nth-of-type(even).blog {
Hintergrund: #2e2e2e;
}
.table-of-contents li.author li:hover.blog {
Hintergrund: #000;
}
.Inhaltsverzeichnis li a {
Textdekoration: keine;
Farbe: #fff;
Rand links: 24px;
Polsterung: 16px 0;
Bildschirmsperre;
}
</style>
</head>
<Körper>
<div class="toc-container">
<h2 class="index-heading">heading</h2>
<ul class="table-of-contents">
<li class="author">
<a href="#">Name des Autors</a>
<ul>
<li class="blog">
<a href="#">Nháp 1</a>
</li>
</ul>
</li>
</ul>
</div>
</body>
</html></pre>