CSS：not Function Not Working

Question

我的问题与css ：不是函数。

当我悬停链接时，它们都强调它们两个项目1 &说明。悬停时，我不希望在下面的描述中看到下划线。

这里是我的菜单代码：

<ul> 
<li> 
    <a href="#"> 
    Item 1 
    <span>Description</span> 
    </a> 
</li> 
</ul> 

CSS：

span { display:block; } 
ul li a:hover:not(span) { color:blue; text-decoration: underline; } 

当我改变跨度显示器inline-block的是工作不错，但必须是唯一的块。我该如何解决它？

此外，内联块显示该项目的说明NEAR。我想把它放在项目名称下。我怎么做到的？

Answer 1

你说的风格：没有（跨度），A是不是SPAN，过程中的是不是一个跨度;）

使用你说的风格

span { display:block; } 
 
ul li a:not(.has-span):hover { color:red; text-decoration: underline; }

<ul> 
 
<li> 
 
    <a href="#"> 
 
    Item 1 
 
    <span>Description</span> 
 
    </a> 
 
</li> 
 
<li> 
 
    <a href="#" class="has-span"> 
 
    Item 2 
 
    <span>Description</span> 
 
    </a> 
 
</li> 
 
</ul>

Answer 2

您不应将您的状态（:hover）放在选择器之前。所以，你需要将其更改为：

ul li a:not(span):hover { color:blue; text-decoration: underline; } 

而且这将不的工作，因为，一个单一的元素不能是<a>以及一个<span>。相反，你需要的只是使用：

span { display:block; } 
ul li a:hover { color:blue; text-decoration: underline; } 
ul li a:hover span { color:black; text-decoration: none; }