Html 未显示预期结果的[标题]

我试图将样式应用于html文档中的一个锚。然而，我尝试了一个[title]来尝试将css样式应用于这一个元素，但什么也没有发生。为什么这行不通呢。对于如何使用这种格式，我希望能得到一些反馈。谢谢

html代码

<div class="col_2">
       <img src="img/blueman.png" width="70" height="70" class="img_left imgshadow" alt="" />
       <p class="newsSpace"><a href="#" title="logout">Signout</a></p>
   </div>

主菜单代码

#menu li a {
    color: #000000;
    display: block;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
    outline: 0 none;
    text-decoration: none;
}

---

您编写的选择器应该可以工作，实际上，正如您从其他注释和答案中看到的，它在单独使用时确实可以工作

CSS不起作用的最可能的原因是CSS中的其他内容优先于它。CSS对选择器有严格的优先级顺序，编写一个被认为比

a[title]

优先级更高的选择器是非常容易的

我建议查看浏览器开发工具（如Firebug等）中的元素，以确定应用于它的样式和选择器

如果我是对的，你会看到

a[title]

样式在那里，但是被划掉了，因为已经应用了其他具有更高优先级的样式

这里有一篇文章描述

有四种方法可以解决这个问题：

调整

a[标题]

选择器，使其优先级高于其他选择器。这通常意味着更精确，例如

.newspace>a[title]

调整其他选择器，使其具有较低的优先级

添加

！重要信息

，以强制浏览器赋予样式最大优先级。（这是“快赢”选项，但应被视为最后手段；使用

！important

通常意味着您在其他地方做错了事情）

更改HTML使元素具有自己的类或ID，并将其用于选择器，而不是

a[title]

希望有帮助

[编辑]

OP在下面评论了一个更新的fiddle链接，现在我可以看到问题了：

好的，谢谢更新的链接。我现在可以在CSS代码中看到

#菜单li div a[title]

通过使用Chrome开发工具（F12）查看所讨论的元素，我可以看到所有的样式都成功地应用于您的

注销
元素。但是，
字体大小
属性被
#菜单li:hover div a
覆盖，由于
：hover
，该属性被归类为更具体

由于元素只有在悬停时才可见，解决方案似乎很简单：只需将相同的
：hover
属性添加到
#menu li div a[title]
，就像应用到其他选择器一样

因此，将其更改为
#菜单li:hover div a[标题]

这又是你的小提琴了，只是做了一个简单的改动：
它似乎可以工作：至少在Chrome 27和IE10中是这样。你看到了什么？@jao它在ff和IE10中不起作用？我将把铬装进去，看看它在那里是否有效。不过，我的大多数用户都使用IE和FF，所以需要尝试寻找替代品。谢谢，我没有检查Firefox，因为我没有安装它。它在IE10中确实可以工作。也许我的标记中有其他东西阻止了它的工作。那么让我们看看它在IE10中的外观。我已经将完整的代码和css发布在：如果您能指出错误所在，我将不胜感激。Thanks@user-我在链接到的小提琴中找不到[标题]
。我可以找到
a.newspace
。这不会选择您给定的HTML中的任何内容，因为
a
和
.newspace
是错误的。对不起，我以为我复制了整个文件。我已经更新了标题代码。Thanks@user1532468-是的，新小提琴更好。我编辑了答案以提供更多帮助。先生，谢谢您的时间和努力。非常感谢
#menu li a {
    color: #000000;
    display: block;
    font-family: Arial,Helvetica,sans-serif;
    font-size: 12px;
    outline: 0 none;
    text-decoration: none;
}