单个div+css实现一个桌灯台灯效果代码
代码语言:html
所属分类:布局界面
代码描述:单个div+css实现一个桌灯台灯效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> body { font-size: 10px; background: pink; background: pink; font-family: "Yeseva One", cursive; } div { width: 100em; height: 55em; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transform-style: preserve-3d; background: radial-gradient(98% 98% at 50% 50%, rgba(51, 51, 51, 0.15), rgba(0, 0, 0, 0) 52%) 39% 85%/15em 4em, radial-gradient(98% 98% at 50% 50%, #333333 50%, rgba(0, 0, 0, 0) 52%) 54.5% 78.6%/1.4em 0.3em, linear-gradient(to right, #d79d61 34%, #a35d21, #8e4e1d) 54.5% 79.5%/1.2em 0.7em, linear-gradient(to right, pink, pink) 64% 14%/2em 2em, linear-gradient(to right, pink 50%, rgba(0, 0, 0, 0.2) 53%) 61.5% 27.3%/1em 4em, radial-gradient(98% 98% at 50% 50%, rgba(183, 115, 52, 0) 40%, rgba(147, 82, 30, 0.6) 50%, transparent 52%) 50% 81.5%/17em 3em, radial-gradient(98% 98% at 50% 50%, rgba(255, 0, 0, 0), rgba(51, 51, 51, 0.1) 50%, transparent 52%) 50% 81.5%/17em 3em, radial-gradient(98% 98% at 50% 50%, rgba(255, 255, 255, 0.1) 40%, rgba(255, 255, 255, 0.1) 50%, transparent 52%) 50% 82%/17em 3em, radial-gradient(98% 98% at 50% 50%, rgba(183, 115, 52, 0.1) 40%, rgba(255, 255, 255, 0.1) 50%, transparent 52%) 50% 81.5%/17em 3em, radial-gradient(98% 98% at 50% 50%, rgba(183, 115, 52, 0) 40%, rgba(147, 82, 30, 0.5) 50%, transparent 52%) 50% 81.5%/17em 3em, radial-gradient(98% 98% at 50% 50%, #b77334 50%, rgba(0, 0, 0, 0) 52%) 50% 81.5%/17em 3em, radial-gradient(98% 98% at 50% 0%, transparent 50%, pink 52%) 50% 89%/17.2em 4em, linear-gradient(to right, #D2904D 5%, #a35d21 30%, #a35d21, #D2904D, #8e4e1d) 50% 85.2%/17em 3.5em, linear-gradient(to right, #d79d61 34%, #a35d21 35%, #a35d21, #d79d61, #8e4e1d) 50% 15%/1.4em 1.6em, radial-gradient(5.........完整代码请登录后点击上方下载按钮下载查看
网友评论0