我想隐藏这个 input
元素。事实上,我几乎没有他们,我不得不使用他们的名字。
<input type="image" alt="Storage Administration" src="App_Themes/Default/topmenu$store$png$ffffff$000000.IconHandler.axd" title="Storage Administration" id="ctl00_ctl00_TopMenuCph_btnAdm" name="ctl00$ctl00$TopMenuCph$btnAdm">
有人可以建议如何使用完整标题或 alt 吗?
[title ~= "Storage"] {
display: none;
}
效果很好,但是在 firefox 和 chrome 中不起作用。
[title ~= "Storage Administration"] {
display: none;
}
如果我不能使用完整的标题,那么如果 input 元素在 .topMenu > div > li
中,我该如何缩小选择?
<ul class="topMenu">
<div id="ctl00_ctl00_TopMenuCph_panTab">
<li><input type="image" alt="Storage Administration" src="App_Themes/Default/topmenu$store$png$ffffff$000000.IconHandler.axd" title="Storage Administration" id="ctl00_ctl00_TopMenuCph_btnAdm" name="ctl00$ctl00$TopMenuCph$btnAdm"></li>
<li><input type="image" alt="Envelope Templates" src="App_Themes/Default/topmenu$envelope$png$ffffff$000000.IconHandler.axd" title="Envelope Templates" id="ctl00_ctl00_TopMenuCph_btnEnv" name="ctl00$ctl00$TopMenuCph$btnEnv"></li>
<li><input type="image" alt="My Documents" src="App_Themes/Default/topmenu$mydocuments$png$ffffff$000000.IconHandler.axd" title="My Documents" id="ctl00_ctl00_TopMenuCph_btnMyD" name="ctl00$ctl00$TopMenuCph$btnMyD"></li>
</div>
</ul>
最佳答案
您正在使用的属性选择器没有按照您期望的方式工作。当您放置 [title~="Storage Administration"]
时,CSS 正在寻找标题恰好是“Storage”或恰好是“Administration”的元素。CSS 将不匹配任何东西。
查看属性选择器规范以获得更详尽的描述:
http://www.w3.org/TR/CSS21/selector.html#attribute-selectors
如果您想要特别查找具有“Storage Administration”作为 title 属性的元素,请使用 [title="Storage Administration"]
。请注意,~
(代字号)已从等式中删除。
在 CSS3 中,有一些额外的属性选择器,例如 *=
子字符串匹配(参见:spec on CSS3 selectors)。其他人正在尝试类似的事情 this other StackOverflow answer .
这是一个使用他们的逻辑的例子。不知道这是否适合您,但请尝试使用这些其他选项。请务必检查浏览器兼容性,因为我不确定对这些浏览器的支持是什么。
[title^='Storage'], [title*=' Storage']{
display: none;
}
关于css - 如何使用具有特定标题的 css 隐藏元素?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31282408/