html5 - 纯CSS怎么做出这种一模一样的导航条导航块那里还有个下拉菜单，请大家指导一下

Question

Answer 1

p.title>p.list
.list{
display:none;
}
.title:hover .list{
display:block;
}
原理はおそらく、CSS疑似クラスを使用してホバー状態の応答を実現し、それによってドロップダウンコンテンツの表示を変更することです。

Answer 2

ドロップダウン メニューの場合、CSS の場合は、親 class:hover child class を直接使用して、opacity:1 を設定するか、トランジション効果。

Answer 3

CSS 疑似クラスを使用して class:hover を実装する場合、いくつかの方法があります。

Answer 4

ブラウザ開発ツールを使用すると、iQiyi はクリック イベントを監視し、ドロップダウン メニューを display:none から display:block に変更できます。CSS を使用する場合は、疑似クラスのみを使用して実装できます。 . 上記の返信はそのようなものです。

Answer 5

まったく同じスタイルは CSS を使用してのみ作成できますが、すべてのクリック イベントは js で実行する必要があります。