Repeat画像の切り出し方

質問

例えばこのサイトの下の方にリピートする「世界を青く」という画像があります。

http://www1.nhk.or.jp/sports/confede/

これは、当然、background-imageのrepeat-xなわけですが、

これを切り出すにあたって、リピートさせるようにするには、

http://www1.nhk.or.jp/sports2/confede/common2013/images/cmn/bg_loop.png

このように切り出されています。

このように、少し不規則な絵を綺麗にrepeat-xするように切り出すのに何かいい方法はございますでしょうか。

回答No.1

warpspace · ベストアンサー

考え方としては、画像を真ん中で縦に切ってから左右を入れ替え、それを繋ぎなおすと
横にリピートしたときに継ぎ目のない画像になります。
ポイントとしては、繋ぎなおしたところが不自然にならないような画像を用いることです。
下記のサイトで解りやすく解説されています。

参考URL：

http://www.riafactory.com/blog/blog201303.php