我有以下HTML代码:
<div class='container-1'>
<div class='div-1'></div>
<div class='div-2'></div>
<div class='div-3'></div>
</div>
<div class='container-2'>
<div class='div-1'></div>
<div class='div-2'></div>
<div class='div-3'></div>
</div>
当我将鼠标悬停在container-1中的div-1上时,我需要在容器-2中更改div-1。 我不能用JS。
有人可以帮助我吗?
由于
答案 0 :(得分:0)
不,你不能,不是纯CSS。
但你可以通过将\documentclass{article}
\usepackage{tikz}
\newcommand{\equic}[2][1 cm]{
\draw (0,0) circle (#1);
\pgfmathparse{#1/1 cm+0.25};
\edef\oc{\pgfmathresult cm};
\foreach \i in {1,...,#2} {
\coordinate (N\i) at (-\i*360/#2:#1);
\coordinate (NB\i) at (-\i*360/#2-180/#2:#1);
\fill[black] (N\i) circle (0.05 cm);
\fill[black] (NB\i) circle (0.05 cm);
\draw (-\i*360/#2:\oc) node{$\i$};
\draw (-\i*360/#2-180/#2:\oc) node{$\bar{\i}$};
}
}
\begin{document}
\begin{tikzpicture}
\equic[5 cm]{6}
\draw (N1) -- (N2) -- (N3) -- (N1);
\draw (NB4) -- (NB5);
\end{tikzpicture}
\end{document}
悬停来实现。
.container-1
.container-1:hover + .container-2 .div-1 {
background-color:red;
}