是否有办法为使用CSS网格布局显示的数组中组件的更改顺序设置动画?
这是一个简短的boilerplate
答案 0 :(得分:6)
根据CSS Grid Layout Module Level 1 specification,有5个可动画的网格属性:
grid-gap, grid-row-gap, grid-column-gap
作为长度,百分比或计算
grid-template-columns, grid-template-rows
作为长度,百分比或计算的简单列表,前提是唯一的差异是列表中长度,百分比或计算组件的值。
答案 1 :(得分:0)
如果您只是希望用户看到文本的更改,您可以让javascript,替换每个div的文本。在这种情况下,div虽然是相同的(例如div-1,div-2,div-3)。你只会改变文字。
如果你想改变完整div +内容(在html中)的位置及其css属性进行更改,那么你必须扩展javascript以获得一个带3个值的函数并随机按顺序排列,(例如, 1,3,2)。通过javascript,您可以根据需要删除并创建div。
答案 2 :(得分:-1)
是的,在Firefox v66中受支持