需要CSS樣式一樣顯示在圖像

Question

我有一個工具提示，我想有提示的外觀，因爲這形象 中顯示如圖

http://www.tiikoni.com/tis/view/?id=fa381ec

我已經試過這種方式，但它不能正常工作 任何人都可以讓我知道如何實現這個？

.flotr-mouse-value { 
    font-size: 10px; 
    border: 45px solid #12a1da; 

} 

Answer 1

，你可以做這樣的：

<div id="tooltip"> 
    <div class="contents"> 
     contents of the tooltip 
    </div> 
    <div class="arrow"></div> 
</div> 

和風格：

#tooltip { 
    position: absolute; 
    left: 50px; 
    top: 50px; 
    width: 300px; 
    height: 150px; 
} 
#tooltip div.contents { 
    background: #ccc;  
    height: 150px; 
    -moz-box-shadow: 3px 3px 3px #666; 
    -webkit-box-shadow: 3px 3px 3px #666; 
    box-shadow: 3px 3px 3px #666; 
} 

#tooltip div.arrow { 
    width: 10px; 
    height: 10px; 
    position: absolute; 
    left: 50px; 
    bottom: -10px; 
    background: url(arrow_down.gif) no-repeat; 
    -moz-box-shadow: 3px 3px 3px #666; 
    -webkit-box-shadow: 3px 3px 3px #666; 
    box-shadow: 3px 3px 3px #666; 
}