html - divのホバー時に対応するタグを表示する方法

Question

こんにちは、私は円形の div を持っています。ホバーするとテキストが表示され、マウス アウトで消えるようにしたいです。アウト

ボタンの私のコードは-

 .cbp-fbscroller > nav a {
    display: block;
    position: relative;
    z-index: 9999;
    color: transparent;
    width: 26px;
    height: 26px;
    outline: none;
    margin: 25px 0;
    border-radius: 50%;
    border: 4px solid #fff;
}

.no-touch .cbp-fbscroller > nav a:hover {
    background: rgba(255,255,255,0.4);
}

.cbp-fbscroller > nav a.cbp-fbcurrent {
    background: #fff;
}

Answer 1

このコードを使用できます.....

.circle {
 width: 150px;
 height: 150px;
 border: 5px solid whitesmoke;
 border-radius: 50%;
 position: relative;
 background:url('http://download.jqueryui.com/themeroller/images/ui-  bg_flat_100_555_40x100.png');
 }
.circle:before {
 position: absolute;
 top: 10px;
 left: 10px;
 right: 10px;
 bottom: 10px;
 background: whitesmoke;
 border-radius: 50%;
 content:"";
 display: block;
  }
 .circle:hover span {
 display:inline;
 width: 0;
 height: 0;
 position: absolute;
 top: 50%;
 left:100%;
 margin: -5px 0px -5px -25%;
 padding: 5px 0px 5px 25%;
}
span
{
display:none;
}

デモ用: JSFIDDLE