2

要素にテキストを追加できる CSS コンテンツ プロパティに出会いました。

例えば：

.class:after{
   content: "testing";
}

残念ながら、IE8 でのみ機能するこの CSS プロパティは、!DOCTYPE でのみ定義されています。

とにかく、これをIE7でも動作させることができる回避策はありますか? JavaScript や jQuery を使用せずに。

4

4 に答える 4

18

私はjsを必要としないこのソリューションを使用しています。

.whatever {
  *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'my content');
}

疑似要素 :before または :after を追加しないでください。また、通常の html エンティティと html hex エンティティを使用できます。スラッシュ、/ などの一部の文字には必須のようです。

このソリューションの font awesome の功績: http://fortawesome.github.com/Font-Awesome/。彼らが技術を開発したかどうかはわかりませんが、私が最初に見た場所です。

IE7 のみをターゲットにするために、条件付き IE コメントに Paul Irish の手法を使用しました。

したがって、次のようになります。

.lt-ie8 .whatever {
  *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = 'my content');
}
于 2012-07-20T10:28:19.880 に答える
2

いいえ、IE7はサポートしていません

唯一のチャンスは、Javascript/Jquery を使用することです。

于 2011-08-23T07:42:48.407 に答える
0

次のように、CSS 式を使用してターゲット要素の後に要素を追加し、別の CSS 式を使用して新しい要素にコンテンツを追加できます。

.class {zoom: expression( this.runtimeStyle.zoom="1", this.appendChild( document.createElement("i")).className="ie-after" );}

.class .ie-after {zoom: expression(this.runtimeStyle['zoom'] = '1', this.innerHTML = 'testing');}​
于 2012-09-04T07:43:13.323 に答える
0

コンテンツが実行時に変更されることを意図していない場合は、次を使用できます。

.icon-glass {
  *zoom: expression( this.runtimeStyle['zoom'] = '1', this.innerHTML = '');
}

コンテンツが実行時に変更されることを意図している場合は、次のようにすることができます。

.icon-glass {
  *top:expression(0, this.innerHTML = '');
}

残念ながら、これは非常に遅いです。パフォーマンスが大幅に低下しても IE6 で動作する可能性がありますが、ページにアイコンが多すぎると IE7 がクラッシュする可能性があります。したがって、ごく少数のアイコンのみを使用し、パフォーマンスの低下を許容できる場合を除き、この 2 番目の手法はお勧めしません。

于 2014-03-25T22:40:32.997 に答える