0

ツールチップを表示するために title 属性を使用しています。

.remove_button{
background-color:#ff3300;
color:#ffffff;
font-family:Courier New,sans-serif;
font-weight:900;
font-size:20px;
float:right;
border-radius:5px;
padding:0px 6px 0px 6px;
margin-right:15px;
}

<div class="remove_button" title="Remove">x</div>

ただし、タイトルは要素内に表示されます

------x------          :When not hovering
------xRemove------    :When hovering

one '-' is one pixel of padding

前回の質問で誤解を招いてしまいましたが、明確に指摘すると、「タイトル」は他のコンテンツの上に表示されているのではなく、実際のボタン内のフロー内に表示されています。これは、タイトルが通常どのように機能するかではありません。

編集: 問題は見つかりましたが、この小さなコードは他の「タイトル ツールチップ」に影響を与えていません。

*[title]:hover:after{
content:attr(title);
background-color:#feeba6;
color:#333333;
}

上記のコードの目的は、ツールチップのスタイルを設定することでしたが、それは実現していないようです。とにかく、それは私がグーグルで見つけたがらくただったと思います。

4

2 に答える 2

2

ブラウザを混乱させる可能性のあるものは他にありませんか?
そのコードのスニペットのみを使用してファイルを作成し、それが機能することを確認できます

于 2012-05-06T17:09:51.900 に答える
1

title 属性を持つ要素に十分な時間カーソルを合わせると、ブラウザーにはツールチップがネイティブに表示されます。

しかし、あなたのツールチップには、あなたが含めていないいくつかのJavaScriptが含まれていると思います...?

于 2012-05-06T17:39:14.823 に答える