如何渲染禁用的HTMLbutton的工具提示
我有一个HTMLbutton。 我试图根据button的“title”属性来渲染一个工具提示，并且它不渲染。 主要是因为它被禁用。
然后，我尝试在一个范围内包装button，并设置范围的“标题”属性。
hover在包裹在该跨度上的button仍然没有效果。 工具提示将在不属于button标签一部分的任何其他部分上呈现。 就像如果我把一些文本放在范围以及button，hover在文本产生工具提示，但如果你把鼠标hover在button上，它不会呈现。
所以：我如何显示禁用button的工具提示？
一个理想的解决scheme是跨浏览器兼容的，这个build议不是; 我已经在Ubuntu 9.10上进行了testing，尽pipe使用了Chrome，Firefox，Epiphany和Opera，并且它们似乎可以在这些方面可靠地工作，这意味着它们在Windows系统中的可靠性。 IE显然是一个完全不同的水壶。
话虽如此：
这个想法基于以下（x）html：
<form> <fieldset> <button disabled title="this is disabled">disabled button</button> </fieldset> </form> 并使用下面的CSS来实现您的目标：
button { position: relative; } button:hover:after { position: absolute; top: 0; left: 75%; width: 100%; content: attr(title); background-color: #ffa; color: #000; line-height: 1.4em; border: 1px solid #000; }
button { position: relative; box-sizing: border-box; } button:hover:after { position: absolute; top: 0; left: 75%; width: 100%; content: attr(title); background-color: #ffa; color: #000; line-height: 1.4em; border: 1px solid #000; box-shadow: 2px 2px 10px #999; }
<form> <fieldset> <button disabled title="this is disabled">disabled button</button> </fieldset> </form>
我通过应用CSS pointer-events: auto;得到了这个工作pointer-events: auto; 到button，虽然这不支持IE <11。
这是一个Firefox的错误： https ： //bugzilla.mozilla.org/show_bug.cgi？ id = 274626
