纯css实现三维断裂金字塔效果代码
代码语言:html
所属分类:布局界面
代码描述:纯css实现三维断裂金字塔效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> html { --c1: #d6d6d6; --c2: #8f8f8f; --c3: #353535; --c4: #161616; background: /*corners bot*/ conic-gradient(from 117deg at calc(50% + 128px) calc(50% + 179px), var(--c4) 72deg, #fff0 0 100%), conic-gradient(from 117deg at calc(50% + 15px) calc(50% + 230px), var(--c4) 72deg, #fff0 0 100%), conic-gradient(from 191deg at calc(50% - 107px) calc(50% + 181px), var(--c4) 50deg, #fff0 0 100%), conic-gradient(from 194deg at calc(50% - 207px) calc(50% + 140px), var(--c4) 55deg, #fff0 0 100%), /*corners top*/ conic-gradient(from 9deg at calc(50% + 154px) calc(50% + 18px), var(--c4) 90deg, #fff0 0 100%), conic-gradient(from 10deg at calc(50% + 72px) calc(50% - 95px), var(--c4) 81deg, #fff0 0 100%), conic-gradient(from -45deg at calc(50% - 50px) calc(50% - 105px), var(--c4) 56deg, #fff0 0 100%), conic-gradient(from -46deg at calc(50% - 198px) calc(50% + 100px), var(--c4) 59deg, #fff0 0 100%), /*bg*/ conic-gradient(from 145deg at 50% calc(5.........完整代码请登录后点击上方下载按钮下载查看
网友评论0