纯css实现建筑类进度条效果
代码语言:html
所属分类:加载滚动
代码描述:纯css实现建筑类进度条效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> :root { --colour1: #f1c40f; --colour2: #2c3e50; --speed: 4s; } html, body { height: 100%; } @-webkit-keyframes slide { from { background-position-x: 0; } to { background-position-x: 113px; } } @keyframes slide { from { background-position-x: 0; } to { background-position-x: 113px; } } .container { height: 100%; display: -webkit-box; display: flex; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; } .container .bar { min-height: 100px; border-radius: 10px; width: calc(113px * .........完整代码请登录后点击上方下载按钮下载查看
网友评论0