html设置提示按钮,如何在禁用的HTML按钮上呈现工具提示

一个理想的解决方案将是跨浏览器兼容，这个建议不是;我已经测试了它只在Ubuntu 9.10，虽然与Chrome，Firefox，Epiphany和Opera，它似乎可靠地工作，这意味着在Windows对应的可靠性。显然IE是一个完全不同的水壶鱼。

话虽如此：

这个想法基于以下(x)html：

disabled button

并使用以下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;

}

disabled button

这不是理想的，但它是最好的非JavaScript的想法，我可以想出。