重複の可能性:
css3 border-image の透明な png の問題
背景が透明で幅が 7px の境界線の画像は次のようになります。
CSS を使用すると、同じ div に繰り返し背景画像があり、境界画像と重なるか、ギャップが残ります。
background-clip: padding-box;
親divにも背景画像があります。そのため、外側の境界画像に透明な背景が必要です。
だから、繰り返しの背景画像を境界線の画像に収めるためにどのようなオプションが必要なのか疑問に思っています。背景の位置を設定できましたが、私が理解しているように、x と y の値でしか開始位置を設定できないため、これは右と下の位置では機能しません。
おそらく、私の唯一のオプションは、Adobe Illustrator で背景画像に使用している画像で境界画像を塗りつぶすことですが、Illustrator のアートボードでパターンを繰り返す方法を考え出す必要があります。また、境界線イメージの中央セクションがページ上でどのように繰り返されるかにも問題がある可能性があります (つまり、境界線イメージのセクションが結合する場所で背景イメージが適切に見えるでしょうか?)。
私が探している結果を達成するための最善の方法についてアドバイスをいただければ幸いです。このページで実際のボーダー画像を見ることができます。メイン コンテンツとサイドバー、およびスライド ダウン コンタクト フォームにはすべて、境界線の画像と重なる背景画像があります。
スクリーンショット:
