1

作成した div に border-image プロパティを実装しようとしています。葉の画像 ( http://imageshack.us/photo/my-images/703/leafy.png/ ) がdivの端。

私はそれをやろうとしましたが、葉を正常に見せることができず、角が重なっているように見えます.border-imageプロパティは本当に混乱し、イライラします.誰かが私を正しい方向に向けることができれば幸いです!

私が使用しているコードは次のとおりです: jsfiddle.net/MQrd6/

そして、私が（大まかに）達成しようとしているのはここです：http://imageshack.us/a/img203/1029/concepto.png

また、IE (いつものように) が border-image プロパティをサポートしていないことも知っていますが、これに対する回避策はありますか? javascriptか何かを使用していますか？

本当に助けてくれてありがとう:)

4

2 に答える 2

1

次のようなものを試すことができます: http://jsfiddle.net/MQrd6/3/

トリックは、の幅を次のように設定することborder-imageですborder-width:

#leaf {
    width: 760px;
    vertical-align: middle;
    border-width: 22px;
    border-image: url(http://img703.imageshack.us/img703/4976/leafy.png) 22 22 round;
}

Border-Image をサポートする IE のバージョンはありません。IE でサポートするには、IE6 以降で複数の CSS3 機能を使用できるシンプルなライブラリであるCSS3pieを試すことができます。

于 2013-04-25T11:49:16.720 に答える
0

画像境界のCSS命令があります：

CSS

-moz-border-image:url("border-image.png") 25 30 10 20 repeat;
-webkit-border-image:url("border-image.png") 25 30 10 20 repeat;
border-image:url("border-image.png") 25 30 10 20 repeat;

詳細情報:

http://css-tricks.com/understanding-border-image/

と

http://css-tricks.com/almanac/properties/b/border-image/

于 2013-04-25T11:11:40.567 に答える