3

私は自分のウェブサイトの境界線で立ち往生しています。垂直メニューの上部に画像を配置したいのですが、下部に1つ、中央に背景を配置したいのですが、うまくいきません。

これは私のコードです：

.border-image {
border: solid transparent 10px; //I tried with and without this line
border-top-image: url(/pictures/menu_top.png) 10 round round;
border-bottom-image: url(/pictures/menu_bottom.png) 10 round round;
}
#menu_left {
background-image: url(/pictures/menu_middle.png);
background-repeat:repeat-y;
}

真ん中の画像しかありませんが、上/下の画像はありません。Firefoxは私に：

プロパティ«border-bottom-image»不明。プロパティ«border-top-image»不明。

私が間違っていることについて何か考えはありますか？

編集：これはFF、Chorme、Operaで機能しますが、IE9では機能しません。

border-color:transparent; border-width:45px 10px 48px 10px;
-moz-border-image:url("../pictures/left_menu_full.png") 45 9 48 9 stretch ;
-webkit-border-image:url("../pictures/left_menu_full.png") 45 10 48 10 repeat;
-o-border-image:url("../pictures/left_menu_full.png") 45 10 48 10 repeat ;
-ms-border-image:url("../pictures/left_menu_full.png") 45 10 48 10 repeat ;
border-image:url("../pictures/left_menu_full.png") 45 10 48 10 repeat ;
4

3 に答える 3

3

あなたが言及した記事のように、-mozFirefoxのプレフィックスを使用する必要があります。

-webkitSafariやChromeforOperaなどのWebkitブラウザの 場合、場合によっては-o… -msMicrosoftの場合。ただし、この場合、border-imageはIE9以下ではサポートされていません。

于 2011-10-22T14:10:12.687 に答える
1

-webkitまた、SafariとGoogleChromeを機能させるために使用することも考えてください。

于 2011-10-22T14:13:18.510 に答える
0

代わりに3divを使用しませんか？背景に境界線を使用するのはちょっと変な方法です。

私は使うだろう

<div id="background-top"></div>
<div id="menu"></div>
<div id="backgroud-bottom"></div>

次に、それらの背景を定義します...

于 2011-10-22T14:14:07.653 に答える