css实现3D花岗岩长方体效果代码

代码语言:html

所属分类:布局界面

代码描述:css实现3D花岗岩长方体效果代码

代码标签: css 3D 花岗岩 长方体

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">






    <style>
        html {
        	--c1: #ffffff;
        	--c2: #d0d0d0;
        	--c3: #a3a3a3;
        	--c4: #161616;
        	--sz: 8vmin;
        	height: 100vh;
        	overflow: hidden;
        	background:
        		/*background*/
        		linear-gradient(-150deg, var(--c4) calc(50% - calc(var(--sz) * 3.67)), #fff0 0),
        		linear-gradient(150deg, var(--c4) calc(50% - calc(var(--sz) * 3.67)), #fff0 0),
        		linear-gradient(-30deg, var(--c4) calc(50% - calc(var(--sz) * 3.645)), #fff0 0),
        		linear-gradient(30deg, var(--c4) calc(50% - calc(var(--sz) * 3.645)), #fff0 0),
        		linear-gradient(90deg,var(--c4) calc(50% - calc(var(--sz) * 3.64)), #fff0 0 calc(50% + calc(var(--sz) * 3.525)), var(--c4) 0),
        		/*granite*/
        		repeating-conic-gradient(#0004 0.00001%, transparent .00005%, transparent .0005%, transparent .00005%),
        		repeating-conic-gradient(#fff2 0.00002%, transparent .00008%, transparent .0008%, transparent .00008%),
        		/.........完整代码请登录后点击上方下载按钮下载查看

网友评论0