在HTML提交按鈕的鼠標懸停上顯示工具提示

我的JSP頁面上有一個簡單的鏈接，如下所示。在HTML提交按鈕的鼠標懸停上顯示工具提示

<a href="" title="Press the button to delete the row." class="icon-2 info-tooltip"></a>

它顯示的圖標，並且當鼠標懸停在它時，它顯示與另一圖標的工具提示作爲顯示在下面的快照。

enter image description here

該工具提示在上述HTML表格的最後一列的最後一行顯示。

顯示默認圖標的css類如下。

a.icon-2  
{ 
    background: url(../images/table/table_icon_2.gif) no-repeat; 
    display: block; 
    float: left; 
    height: 24px; 
    margin: 0 8px 0 0; 
    width: 24px; /*Displays a default icon*/ 
}

當鼠標懸停在鏈接上時，默認圖標被替換爲以下css類。

a:hover.icon-2 
{ 
    background: url(../images/table/table_icon_2.gif) 0 -24px; 
    /*Displays icon on mouse hover.*/ 
}

和實際顯示工具提示的css類如下。

#tooltip  
{ 
    background-color: #8c8c8c; 
    border: 1px solid #767676; 
    color: #fff; 
    font-family: Arial; 
    font-size: 10px; 
    font-weight: normal; 
    opacity: 0.85; 
    padding: 0 5px; 
    position: absolute; 
    text-align: left; 
    z-index: 3000; 
}

現在，我需要顯示與HTML相同的圖標相同的工具提示鼠標懸停<input type="submit">提交按鈕。它如何顯示？

來源

2012-02-29 Bhavesh

同樣的方法，但使用CSS選擇器來提交''按鈕而不是'a'鏈接... – 2012-02-29 00:09:59

而不是a:hover.icon-2，請嘗試.icon-2:hover。

來源

2012-02-29 00:37:20 FoxKllD

在HTML提交按鈕的鼠標懸停上顯示工具提示

回答

相關問題