纯css无div布局实现一个多彩蜗牛效果代码
代码语言:html
所属分类:布局界面
代码描述:纯css无div布局实现一个多彩蜗牛效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> body{ background: radial-gradient(40% 40% at 50% 50%, #8a2be2 47% , transparent 53%) 65em 23.5em/6.5em 4em, radial-gradient(40% 40% at 50% 50%, #8a2be2 47% , transparent 53%) 62.65em 25em/3.5em 5em, radial-gradient(40% 40% at 50% 50%, #8a2be2 47% , transparent 53%) 61.5em 29em/3em 5em, radial-gradient(40% 40% at 50% 50%, #8a2be2 47% , transparent 53%) 70.75em 25.75em/2.5em 4.5em, radial-gradient(40% 40% at 50% 50%, #8a2be2 47% , transparent 53%) 71.5em 29em/3em 5em, radial-gradient(40% 40% at 50% 50%, #ffb6c1 49% , transparent 51%) 65em 26em/8em 12em, radial-gradient(40% 40% at 50% 50%, #b22222 49% , transparent 51%) 64.75em 26em/10em 14em, radial-gradient(40% 40% at 50% 50%, #ffb6c1 49% , transparent 51%) 61em 22.85em/15.5em 23em, radial-gradient(40% 40% at 50% 50%, #b22222 49% , transparent 51%) 59em 19em/18em 28em, radial-gradient(40% 40% at 50% 50%, #9cd8ff 49% , transparent 51%) 60.75em 25.25em/3em 1em, radial-gradient(40% 40% at 50% 50%, #9cd8ff 49% , transparent 51%) 55.25em 25.25em/3em 1em, radial-gradient(40% 40% at bottom, #9cd8ff 49% , transparent 51%) 54.25em 18em/8em 8em, radial-gradient(40% 40% at bottom, #9cd8ff 49% , transparent 51%) 56.75em 18em/8em 8em, radial-gradient(40% 40% at top, #000 49% , transparent 51%) 59em 25.85em/3em 3em, radial-gradient(40% 40% at top, #000 49% , transparent 51%) 56.75em 25.85em/3em 3em, radial-gradient(40% 40% at top, #ff0000 49% , transparent 51%) 58em 25.75em/5em 5em, radial-gradient(40% 40% at top, #ff0000 49% , transparent 51%) 55.65em 25.75em/5em 5em, radial-gradient(40% 40% at 50% 50%, #f1ff62 49% , transparent 51%) 56.75em 22em/8em 8em, radial-gradient(40% 40% at 50% 50%, #f1ff62 49% , transparent 51%) 54.25em 22em/8em 8em, radial-gradient(40% 40% at 50% 50%, #9cd8ff 49% , transparent 51%) 55.25em 35.25em/13.5em 5.5em, linear-gradient(90deg , #9cd8ff 50% , transparent 50%) 60em 27em/ 1.5em 10em, radial-gradient(40% 40% at 50% 50%, #ffb6c1 49% , transparent 51%) 50em 10em/35em 40em, radial-gradient(40% 40% at 50% 50%, #ffb6c1 49% , transparent 51%) 50em 33em/35em 8em, linear-gradient(90deg , #9cd8ff 50% , transparent 50%) 58.25em 27.5em/ 1.5em 10em, radial-gradient(40% 40% at 50% 50%, #9cd8ff 49% , transparent 51%) 41em 34em/52em 8em, radial-gradient(40% 40% at 50% 50%, #f1ff62 49% , transparent 51%) 36em 34.75em/62em 8em, radial-gradient(40% 40% at 50% 50%, #f1ff62 49% , transparent 51%) 52em 37em/7em 4em, radial-gradient(40% 40% at 50% 50%, #f1ff62 49% , transparent 51%) 55em 36.75em/9em 5em, radial-gradient(40% 40% at 50% 50%, #f1ff62 49% , transparent 51%) 58em 37em/9em 5em, radial-gradient(40% 40% at 50% 50%, #f1ff62 49% , transparent 51%) 61.5em 37em/9em 5em, radial-gradient(40% 40% at 50% 50%, #f1ff62 49% , transparent 51%) 65em 37.25em/9em 5em, radial-gradient(40% 40% at 50% 50%, #f1ff62 49% , transparent 51%) 67.5em 37.25em/9em 5em, radial-gradient(40% 40% at 50% 50%, #f1ff62 49% , transparent 51%) 71.25em 36.75em/9em 5em; background-repeat:no-repeat; font-size:10px; height:80em; width:80em; .........完整代码请登录后点击上方下载按钮下载查看
网友评论0