Css <；李>；显示时img和描述消失：无应用

我的li元素以img为背景，文本写在侧面。我想显示：无-仅显示文本，并使其仅在悬停时显示。但是，如果我对包含文本的span元素应用display:none，则会删除整个li元素。请检查所附的图像

你可以试试这个。您将只使用鼠标在悬停图像上显示文本 css

正文
{
字体系列：无衬线；
}
.图像悬停文本容器
{
位置：相对位置；
显示：内联块；
宽度：自动；
高度：自动；
过渡：所有0.2s线性；
}
.图像悬停图像
{
显示：块；
}
/*使图像圆*/
.图像悬停图像img
{
边界半径：0%；
宽度：300px；
}
.图像悬停文本
{
位置：绝对位置；
排名：0；
宽度：100%；
身高：100%；
保证金：0自动；
不透明度：0；
游标：默认值；
过渡：不透明度0.2s线性；
}
.图像悬停文本：悬停
{
不透明度：1；
}
.图像悬停文本气泡
{
位置：相对位置；
框大小：边框框；
顶部：0；左侧：0；右侧：100%；
身高：100%；
文本对齐：居中；
背景：rgba（2182112110.9）；
边界半径：0%；
保证金：0自动；
填充：30%0px；
溢出：隐藏；
字号：17px；
文本对齐：居中；
单词包装：打断单词；
}
.图像悬停文本.图像悬停文本标题
{
字体大小：25px；
显示：块；
}

样品
此文本显示在悬停图像上。

看一看

您在文章中使用了这个选择器，所以我认为您在代码中没有使用相同的选择器来执行display:none

#fixed ul li a span{
    display: none;
}

这将应用显示：无；以子代方式（任何元素匹配范围，即匹配a的元素的子代，即匹配li的元素的子代等）

#fixed > ul > li > a > span{
    display: none;
}

这是一种更为“严格”的方法，可以做到几乎相同的事情（任何元素匹配范围都是匹配a的元素的直接子元素，等等）

这两个选择器都应该工作（请参见下面的示例）。因此，如果不工作，您的代码中可能会出现应用display属性继承或类似内容的错误，或者您的完整代码在两个选择器之间存在差异（可能您需要选择direct Child，而您正在选择后代）

首先尝试应用直接子选择器，只需在子体之间添加>，如果不工作，请检查并尝试查找应用继承的位置

另一个可能的原因是，您可能正在使用js或jquery应用display none，而它没有正确捕获选择器，因此，请尝试检查并确定应用了display属性的位置。（可能您编码了一个

$（'#fixed'）。hide（）

ul#first>li>a>span{display:none；}
ul#second li a span{display:none；}

ul#first>li>a>span{display:none；}




ul#second li a span{display:none；}




未应用css

提供您的代码。如果遇到错误，请逐字复制并粘贴错误消息（逐字）进入您的问题。除非您需要传达布局错误，否则请避免使用屏幕截图。我们无法将您的图像复制并粘贴到我们的IDE中以修复您的代码。然后，我有更好的方法从需要单击到我的IDE中的图像中重新键入您的代码：