示例实时演示
<!doctype html><html> <head> <style> div { width: 400px; height: 300px; background: white; border: 10px solid red; animation: myanim 3s infinite; bottom: 30px; position: absolute; } @keyframes myanim { 20% { bottom: 100px; box-shadow: 30px 45px 70px orange; column-count: 4; } } </style> </head> <body> <h2>performing animation on column-count property</h2> <div>this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text! this is demo text!</div> </body></html>
以上就是动画css的column-count属性的详细内容。