3

IE8でも機能する矢印効果のあるドロップダウンメニューを作成する方法。

やったこと 矢印の画像を切り取り、以下のCSSコードを書きました。ie8でも機能 するようなメニューを作成する解決策はありますか?

 .main-navigation li ul:before {
background: url("images/arow.png") no-repeat scroll left center / 100% auto transparent;
content: "";
display: block;
height: 22px;
left: -6px;
position: absolute;
top: -20px;
width: 222px;
z-index: 1;
 }

.main-navigation li ul {
background-color: #000000;border-color: -moz-use-text-color #494949 #494949;
border-radius: 0 0 5px 5px; border-style: none solid solid; border-width: 0 1px 1px;
box-shadow: 0 0 9px 1px rgba(0, 0, 1, 0.75); padding-top: 10px;  width: 212px; }

この画像を行として使用しました

実際に必要な出力

4

3 に答える 3

5

これを試してください（純粋なCSS）

デモはこちら

そしてこれが ソース

IE8で動作

于 2013-08-09T04:40:46.307 に答える
-1

また、ヘッドセッションの下に次を追加してみてください。

<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
</head>
于 2013-08-09T04:43:57.347 に答える
-3

タグの間に次のメタ タグを追加し<head>ます。

<meta http-equiv="X-UA-Compatible" content="IE=edge">
于 2013-08-09T04:37:44.523 に答える