1

サイトを公開する前に、サイトの最終テストを行っています。私はChromeでそれを構築しましたが、IEで機能したすべてのものを見つけています!

作成したスプライトが IE に表示されない...

HTML

<a href="https://plus.google.com/111035429397283398622/" target="_blank"><img src="http://127.0.0.1:600/wordpress/wp-content/uploads/2012/06/spacer.gif" class="sprite social plus1" alt="Join our Circles on Google+" /></a>

<a href="http://www.facebook.com/primorisfinancial" target="_blank"><img src="http://127.0.0.1:600/wordpress/wp-content/uploads/2012/06/spacer.gif" class="sprite social facebook" alt="Like Primoris Financial on Facebook" /></a>

<a href="http://au.linkedin.com/in/benjaminirons" target="_blank"><img src="http://127.0.0.1:600/wordpress/wp-content/uploads/2012/06/spacer.gif" class="sprite social linkedin" alt="Benjamin Irons on LinkedIn" /></a>

<a href="http://primorisfinancial.blogspot.com" target="_blank"><img src="http://127.0.0.1:600/wordpress/wp-content/uploads/2012/06/spacer.gif" class="sprite social blogger" alt="Primoris Financial on Blogger" /></a>

<a href="http://twitter.com/PrimorisFinPlan" target="_blank"><img src="http://127.0.0.1:600/wordpress/wp-content/uploads/2012/06/spacer.gif" class="sprite social twitter" alt="Follow Primoris Financial on Twitter" /></a>

<a href="http://www.youtube.com/PrimorisFinancial" target="_blank"><img src="http://127.0.0.1:600/wordpress/wp-content/uploads/2012/06/spacer.gif" class="sprite social youtube" alt="Primoris Financial on YouTube" /></a>

次のCSSで

.sprite {background:url(http://127.0.0.1:600/wordpress/wp-content/uploads/2012/06/Social-CSS-Sprite-Test.png);}
    .social {height:32px;}

/* Social Buttons */

        .plus1 {width:32px; background-position:0px 0px;}
        .facebook {width:32px; background-position:-33px 0px;}
        .linkedin {width:32px; background-position:-66px 0px;}
        .blogger {width:32px; background-position:-99px 0px;}
        .twitter {width:32px; background-position:-132px 0px;}
        .youtube {width:32px; background-position:-165px 0px

;}

4

2 に答える 2

1

私が見る限り、主な問題の1つは、引用符/スピーチマークを使用せずにCSSの画像にリンクしていることです。そして、dystroyが言ったように、画像にハードリンクしないでください。比較的次のようにするのが最善です。

{background:url('../wp-content/uploads/2012/06/Social-CSS-Sprite-Test.png');}

これで問題が解決するはずです。

于 2012-06-13T07:18:18.173 に答える
0

画像からsrcを削除します（imgよりもspanを使用することをお勧めします）。

cssのURLを相対的なものに修正し、127.0.0.1（localhost）を指さないようにします。

正しいHTMLヘッダーがあることを確認してください：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
于 2012-06-13T07:13:38.837 に答える