HTMLスパンタイトルフォントサイズを変更するにはどうすればよいですか？

Question

スパンタイトル要素のフォントサイズを変更しようとしています。私は良い例えばグーグルた、と私はこの1つを発見した：link

をしかしタイトルがグレーツールチップ内に表示されている場合でも、二つ目が表示されます。

私の質問は次のとおりです。この第二のスタイルをどのように1つのツールチップ（黄色のもの）のフォントサイズを増やすことによって？

私のスパンは次のようになります。私はあなたのフィドルをテストしてい

<span title=${code} ></span> 

Answer 1

、この問題はFirefoxのみで起こっているようです。ホバーに表示される1つのボックス（CSSでのコンテンツの書き込み）とブラウザ標準のタイトル属性を表示するだけです。

あなたは本当の「タイトル」属性を気にしない場合は、回避策このような使用することができます。

あなたのHTMLの出力：http://jsfiddle.net/tDQWN/9078/

は、単にコードの3行を変更

<span title=${code} ></span> 

とのCSS：コンテンツの後：

a[data-title]:hover:after { 
    content: attr(data-title); 
    padding: 4px 8px; 
    color: #333; 
    position: absolute; 
    left: 0; 
    top: 100%; 
    white-space: nowrap; 
    z-index: 20px; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border-radius: 5px; 
    -moz-box-shadow: 0px 0px 4px #222; 
    -webkit-box-shadow: 0px 0px 4px #222; 
    box-shadow: 0px 0px 4px #222; 
    background-image: -moz-linear-gradient(top, #eeeeee, #cccccc); 
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #eeeeee),color-stop(1, #cccccc)); 
    background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc); 
    background-image: -moz-linear-gradient(top, #eeeeee, #cccccc); 
    background-image: -ms-linear-gradient(top, #eeeeee, #cccccc); 
    background-image: -o-linear-gradient(top, #eeeeee, #cccccc); 
} 

I単純な言葉では、私はちょうど "データタイトル"属性の "タイトル"属性を変更しています。この場合、ブラウザーは標準の「タイトル」属性ではないため、その小さなタイトルテキストを出力しません。今、あなたはただ一つの箱のスタイルを作らなければなりません。

Answer 2

[title]:hover:after{ 
 
    content: attr(title); 
 
    background:yellow; 
 
    padding: 5px; 
 
    border-radius:5px; 
 
    border:1px solid; 
 
}

<span title="jayeshshelar.com">Jayesh Shelar</span>