書き換えられたタイトルは次のとおりです。 カーソルがリスト要素に移動したことに応じてリストのタイトルを変更します。
<p>リンク テーブルを作成しています。リスト リンクの 1 つにマウスを移動したときにテーブル ヘッダーの背景色を変更して、テーブルをより美しくしたいと考えています。ただし、コンテナ要素の小さな要素に影響を与えて、コンテナ要素のプロパティを変更する方法がわかりません。これは私のコードです: </p>
<pre class="brush:php;toolbar:false;"><html lang="vi">
<頭>
<スタイル>
.toc-コンテナ {
最大幅: 600ピクセル;
フォントファミリー: 「Roboto」、サンセリフ;
背景: #deff9d;
境界半径: 8px;
ボックスシャドウ: 0 4px 11px rgba(0, 0, 0, 0.6);
}
.toc-container h2.index-Heading {
テキスト変換: 大文字;
フォントの太さ: 通常;
マージン: 0 16px;
パディングトップ: 16px;
}
。目次 {
リストスタイル: なし;
パディング: 0;
}
.目次 li.author li.blog {
背景: #222;
トランジション: 400ms;
リストスタイル: なし;
}
.目次 li.author{
背景色: 緑;
}
.目次 li.author li:nth-of-type(even).blog {
背景: #2e2e2e;
}
.目次 li.author li:hover.blog {
背景: #000;
}
.目次 li a {
テキスト装飾: なし。
色: #fff;
マージン左: 24px;
パディング: 16px 0;
表示ブロック;
}
</スタイル>
</head>
<本体>
<div class="toc-container">
<h2 class="index-Heading">見出し</h2>
<ul class="目次">
<li class="著者">
<a href="#">著者名</a>
<li class="ブログ">
<a href="#">Nháp 1</a>
</li>
</ul>
</li>
</ul>
</div>
</ボディ>
</html></pre>