问题描述
好吧,我想知道我们是否可以用CSS中的任意偏移重复背景?从那我的意思是我们可以移动瓦x和y像素每次它的渲染呢?
Well, I am wondering if we can repeat a background with an arbitary offset in CSS ? From that i mean can we "Shift" a tile x and y pixel everytime its rendering it ? The uses cases could be mosiacs, patterns and a lot of stuff, Even isometric tiling can be achieved using so.
例如,如果我有一个10px x 10px的瓷砖
For example if i have a tile of 10px x 10px
每次瓷砖重复时,我想从顶部移动10px,所以我将实现
Each time the tile is repeated i want to shift it 10px from top so what i will achieve is
[//]
[//]
[//]
[//]
所以有任何现存的解决方案,或者是Canvas的方式去(在画布上做,然后用它作为背景)
So is there any existant solution or is Canvas just the way to go ( Do it in canvas and then use it as a background )
推荐答案
从CSS3开始,这不能只使用CSS样式。重复模式在x(水平)方向,y(垂直)方向,同时在两个方向上都是周期性的,或者不是(单个图像)。
As of CSS3, this can't be done using only CSS styling. Repeated patterns are periodic either in the x (horizontal) direction, y (vertical) direction, both directions simultaneously, or neither (single image).
参考:
这篇关于重复背景与CSS中的任意偏移的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!