我正在使用jQuery UI
Tooltip widget
<li> <div class="i1"> <a href="#inf-1"title="ΕΝΤΟΠΙΣΜΟΣ"> <span class="ui-icon ui-icon-search"></span> </a> </div> </li> <li><a href="#inf-2"title="ΠΛΗΡΟΦΟΡΙΕΣ"><span class="ui-icon ui-icon-info"></span></a></li> <li><a href="#inf-3"title="ΕΠΙΠΕΔΑ"><span class="ui-icon ui-icon-copy"></span></a></li>
我根据他们的例子编写了以下CSS,它的作用就像一个魅力:
.tooltip { display:none; background: black; font-size:12px; height:10px; width:80px; padding:10px; color:#fff; z-index: 99; bottom: 10px; border: 2px solid white; /* for IE */ filter:alpha(opacity=80); /* CSS3 standard */ opacity:0.8; }
但是我有3-4个工具提示,我想看起来不一样(像上面的示例html),所以我把它包在一个类
并做到了这一点:
.i1 .tooltip { display:none; background: red; font-size:12px; height:40px; width:80px; padding:20px; color:#fff; z-index: 99; bottom: 10px; left: 50px important!; border: 2px solid white; /* for IE */ filter:alpha(opacity=80); /* CSS3 standard */ opacity:0.8; }
这绝对没有。如何覆盖通用的.tooltip来定制不同的工具提示?
提前致谢