css - css url() が Internet Explorer 10 で認識されない

Question

CSSに次の行があります。

.ui-icon-zoom-in { content: url(images/16x16/ZoomIn.png); }

$("#zoomin").button({ text: false, icons: { primary: "ui-icom-zoom-in" } });

Chrome では、ボタンの中央に画像が表示されます。ただし、IE10では画像が表示されません。

ここで何か不足していますか？

score 15 · Accepted Answer

このcontentプロパティは、:before および :after 疑似要素でのみ有効です。次のように変更する必要があります。

.ui-icon-zoom-in { 
  background: url(images/16x16/ZoomIn.png) no-repeat; 
  width:16px;
  height:16px;
}

それとは別にcontent、有効な DOCTYPE が指定されている場合、IE8+ はプロパティのみをサポートします。

score 2 · Accepted Answer

このプロパティは、CSS3 の疑似要素でのみcontent受け入れられます。オブジェクトに画像を追加するには、おそらく jQuery セレクターを使用する必要があります。:before:after

$("#zoomin").html("<img src='images/16x16/ZoomIn.png' alt='Zoom In'>");

4 に答える 4