css - 左右に分割されたスプライトを左に繰り返す

Question

私はこのスプライトシートを持っており、さまざまな背景に対して左に水平に各列を繰り返す必要があります。どうすればこれを達成できますか？background-position、background-repeat、background-size をいろいろ試しましたが、目的の動作を実現できません。誰でもこれを行う方法を知っていますか?

Answer 1

水平ではなく垂直にスプライトを作成できる方がよいでしょう。

このような ：

Answer 2

各色を個別に保存し、必要に応じて背景を動的に構築してみませんか?

したがって、繰り返したい色を繰り返してから、必要に応じて側面に他の色を追加します.

また、達成したい効果についてより具体的に教えてください。