我试过+,控制台标志,<和>。他们不工作,有人可以为我做这个代码吗?我现在已经搞乱了一个小时,我似乎无法找到它的解决方案。
对于之前的帖子感到抱歉。
HTML
<ul>
<li id="meist">
<p><a href="meist.html">Meist</a></p>
</li>
<li id="seadmed">
<p><a href="seadmed.html">Seadmed</a></p>
</li>
<li id="tooted">
<p><a href="tooted.html">Tooted</a></p>
<li id="hooldus">
<p><a href="tooted.html">Tooted</a></p>
<li id="kontakt">
<p><a href="kontakt.html">Kontakt</a></p>
</ul>
<ul>
<li id="submeist"> <p> ASD </p>
</li>
</ul>
CSS
#meist {
display: inline;
float:left;
width:180px;
height:50px;
color:#191919;
text-align:center;
overflow:hidden;
background:#990000;
-moz-border-radius-top-left: 50px;
border-top-left-radius: 50px;
}
#submeist {
display:block;
color:#ccc;
}
#meist:hover < li #submeist{
color: #000
}
#meist:hover
{
text-decoration: underline;
color: white;
font-size: 17.5px;
line-height: 15px;
}
答案 0 :(得分:1)
答案 1 :(得分:1)
这是最近的解决方案。
<强> HTML:强>
<ul id="meist">
<li>
<p><a href="meist.html">Meist</a></p>
</li>
<li id="seadmed">
<p><a href="seadmed.html">Seadmed</a></p>
</li>
<li id="tooted">
<p><a href="tooted.html">Tooted</a></p>
<li id="hooldus">
<p><a href="tooted.html">Tooted</a></p>
<li id="kontakt">
<p><a href="kontakt.html">Kontakt</a></p>
</ul>
<ul id="submeist">
<li class="submeist-sub"> <p> ASD </p>
</li>
</ul>
<强> CSS:强>
#meist {
display: inline;
float:left;
width:180px;
height:50px;
color:#191919;
text-align:center;
overflow:hidden;
background:#990000;
-moz-border-radius-top-left: 50px;
border-top-left-radius: 50px;
}
#submeist {
display:block;
color:#ccc;
}
#meist:hover + #submeist > .submeist-sub{
color: #000
}
#meist:hover
{
text-decoration: underline;
color: white;
font-size: 17.5px;
line-height: 15px;
}
样本:
答案 2 :(得分:1)
由于CSS目前没有可用的父选择器,因此只有CSS才能实现您想要实现的目标。您要么必须更改html的结构,要么使用Javascript来获得所需的结果。使用jQuery可以很容易地完成这样的事情。