2011-02-10 13 views
0

定期的に使用するサイトのCSSをカスタマイズしたいと考えています。CSSタイトル質問

私の質問は、要素のタイトルタグ(下記)に関するものです。

<span title="42%" class="progress"><span style="width: 42%;" class="indicator"> 
</span></span> 

私はこのタイトルタグ(この場合は42%ですが、動的に変化します)を使用してCSSを使用してテキストとして表示したいと考えています。

明らかに、このユニットが動的に変化するという事実から、厄介な部分が生じます。

CSSを使用して「タイトルとしてのユニットをテキストとして表示」する方法はありますか?

ご協力いただきありがとうございます。

トム・パーキンス

+1

内容とデザインを混在させることは恐ろしいことです。あなたが望むものは、1つのポイントから始まる独立したエンティティですが、永遠に分離したままにしておく必要があります。両方を結合したい場合は、javascriptを使用します。 –

+0

あなたの質問について詳しく説明できますか?それは明らかではない。 – borayeris

答えて

2

既存のテキスト/要素の代わりに、カスタム設計されたツールチップなどと一緒にtitle属性を表示し、一部のブラウザでは、CSS attr()機能をサポート:

.progress:after { 
    content: attr(title); 
} 

this jsFiddle exampleを参照してください。

+0

CSSの 'content:attr()'も動的に動作することに興味があります。ちょうどそれを試しました。 –

+1

もちろん、これは単なる実験に過ぎず、IEなどのすべてのブラウザでのサポートを保証するものではありません。 – BoltClock

+0

IEで 'attr()'がサポートされていても、少なくとも:IE6/7では ':after'はサポートされていません。私はそれがIE8になったと思うが、あなたはそれが動的に動作することを確認するためにそれをチェックしたいかもしれない。 – Spudley

0

としては、ここで言った:

http://groups.google.com/group/css-design/browse_thread/thread/3c3194dd0a3c7898

「ツールチップとしてタイトルのプレゼンテーションが ブラウザの関数であり、HTMLまたはCCSによって制御されていません。」

あなたはそのリンクをたどってその修正を見ることができます

+0

それは彼が求めていたものではありません。 –