CSSで画像のセクションを繰り返します

Question

私は、たとえば、picureの真ん中を絵の部分を取り、DIVの背景にのみ、そのセクションを繰り返したいです。これはリモートで可能であってもですか？私はJavaScriptでこれを行うことができたとし、それは厄介だろう。

理論的には私の質問への答えは、画像から単一のピクセルを取り、ラインで、または固体の背景としてそれを繰り返すことができるはずです。

誰もが、私はCSSでこれを行う可能性がどのように任意のアイデアを持っていますか？

Answer 1

あなたはCSS3 border-image を使用してこの効果を実現することができるかもしれませんプロパティます。

残念ながら、私はCSS2でこの種のものを行うための方法を認識していないです。また、私はスプライトが、彼らは、画像だけでは、画像の特定の部分を表示することができ、あなたの部分を伸ばしていないので、あなたは、CSSスプライトを経てこれを行うことができないと思います。

スティーブ

Answer 2

ここではいくつかが述べたことに反して、画像に応じて、あなたはCSS /スプライトでこれを行うことができます。しかし、それは常にそうであることを行っていません。それがダウンして繰り返したい画像に来て、それはあなたがそれがで繰り返したい、それが上の存在スプライト、あなたはそれを繰り返したい方向、およびコンテナのサイズに関連して、高さ/幅です。

の
<サブ>（ソース： sampsonresume.com の）

他の部分はボタンとして機能し、ロールオーバ状態ナビゲーションにできるが、

このスプライトは、サイドバーで使用するための左100ピクセルに繰り返すことができます。小さな変更で、あなたは繰り返し部分を水平にすることができます。

Answer 3

あなたは、クロスブラウザのソリューションをしたい場合は、

現在、あなたはCSS-ソリューションをしたい場合は特に、運の外出ます。

JavaScriptでそれを行うための唯一の方法は、canvas要素を通じてだろうが、それはIEでサポートされていない。

Answer 4

CSSはこれを行うことはできません。ただし、それをサーバー側を行うか、SVGグラフィックまたはFlashを使用してすることができます。プラグインでそれをやってすることは技術的には「背景画像」ではないことに注意してください、あなたはそれの上にあなたのコンテンツを配置する必要があると思います。