Question

我的页面上有几个div。它们中的每一个都具有title属性，因此用户可以将鼠标悬停在它们上以获取更多信息。直到今天，它们都是非常简单的背景（我在开始设计风格之前正在进行布局/功能），标题按预期工作。现在我添加了渐变背景，标题不再出现了。

涉及的浏览器是IE8。

HTML：

<div title='' class="mywrapclass"> <!-- no title because an outer wrapper has a title I want to suppress here -->
    <div title="More information..." style="width:40px;height:50px" class="myclass"></div>
</div>

CSS：

.myclass
{
    border: 1px solid white;
    border-bottom:none;
    bottom:0%;
    position:absolute;
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType="1", startColorstr='#87aaff', endColorstr='#000044');
}

.mywrapclass
{
    background-color:White;
    position:absolute;
    left:58%;
    width:32%;
    height:100%;
    overflow: hidden;
}

如何让标题再次发挥作用？

Answer 1

您需要向background-color添加.myclass。现在，title会在悬停时弹出。实例：http://jsfiddle.net/tw16/TbdAm/

.myclass{     
    background-color: white; /* add this */
    border: 1px solid white;
    border-bottom:none;
    top:0%;
    position:absolute;
    filter: progid:DXImageTransform.Microsoft.gradient(GradientType="1", startColorstr='#87aaff', endColorstr='#000044');
}

Answer 2

我认为这里可能存在两个问题：

您可能需要为IE8设置-ms-filter。请参阅http://msdn.microsoft.com/en-us/library/ms530752(v=vs.85).aspx
即使您将height和width内联设置，IE仍可能会遇到haslayout的问题。通过向zoom:1;

.myclass

修改

根据评论


使用-ms-filter而不是filter会导致渐变不呈现，   但标题有效。

根据MS docs
尝试使用引号

使用-ms-filter时，将progid用单引号（'）或。括起来   双引号（“）。使用逗号（，）分隔多个值，如   如示例部分所示。

因此，选择一组引号括起progid，另一组引用progid内的引号。看看是否有效

Answer 3

这里只是一个“疯狂”的猜测，因为我之前没有使用过此方法，但尝试删除1周围的GradientType引号

应用渐变时，标题从div消失

3 个答案: