css实现马路旅行菜单切换效果代码-html代码-BFW代码库

css实现马路旅行菜单切换效果代码

代码语言：html

代码描述：css实现马路旅行菜单切换效果代码

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/all.min.css">
    <link href="https://fonts.googleapis.com/css2?family=Original+Surfer&display=swap" rel="stylesheet">


    <style>
        :root {
        	"rgb(199,117,166)","rgb(245,51,100)"
        	/*green-ish*/
        	--base: rgb(68, 143, 48);
        	/*teal-ish*/
        	--base2: rgb(36, 108, 96);
        	/*orange-ish*/
        	--base3: rgb(170, 102, 57);
        	/*red-ish*/
        	--base4: rgb(163, 54, 67);
        
        	--r: 73;
        	--g: 243;
        	--b: 218;
        
        	--r2: 60;
        	--g2: 39;
        	--b2: 119;
        
        	--r3: 170;
        	--g3: 102;
        	--b3: 57;
        
        	--r4: 163;
        	--g4: 54;
        	--b4: 67;
        
        	--col1-00: rgb(calc(var(--r) - 100), 0, 0);
        	--col1-0: rgb(calc(var(--r) - 50), calc(var(--g) - 50), calc(var(--b) - 50));
        	--col1-1: rgb(calc(var(--r) - 40), calc(var(--g) - 40), calc(var(--b) - 40));
        	--col1-2: rgb(calc(var(--r) - 30), calc(var(--g) - 30), calc(var(--b) - 30));
        	--col1-3: rgb(calc(var(--r) - 20), calc(var(--g) - 20), calc(var(--b) - 20));
        	--col1-4: rgb(calc(var(--r) - 10), calc(var(--g) - 10), calc(var(--b) - 10));
        	--col1-5: rgb(var(--r), var(--g), var(--b));
        	--col1-6: rgb(calc(var(--r) + 10), calc(var(--g) + 10), calc(var(--b) + 10));
        	--col1-7: rgb(calc(var(--r) + 20), calc(var(--g) + 20), calc(var(--b) + 20));
        	--col1-8: rgb(calc(var(--r) + 30), calc(var(--g) + 30), calc(var(--b) + 30));
        	--col1-9: rgb(calc(var(--r) + 40), calc(var(--g) + 40), calc(var(--b) + 40));
        	--col1-10: rgb(calc(var(--r) + 50), calc(var(--g) + 50), calc(var(--b) + 50));
        	--col1-11: rgb(calc(var(--r) + 60), calc(var(--g) + 60), calc(var(--b) + 60));
        	--col1-12: rgb(calc(var(--r) + 70), calc(var(--g) + 70), calc(var(--b) + 70));
        	--col1-13: rgb(calc(var(--r) + 80), calc(var(--g) + 80), calc(var(--b) + 80));
        
        	--col2-00: rgb(calc(var(--r2) - 100), 0, 0);
        	--col2-0: rgb(
        		calc(var(--r2) - 50),
        		calc(var(--g2) - 50),
        		calc(var(--b2) - 50)
        	);
        	--col2-1: rgb(
        		calc(var(--r2) - 40),
        		calc(var(--g2) - 40),
        		calc(var(--b2) - 40)
        	);
        	--col2-2: rgb(
        		calc(var(--r2) - 30),
        		calc(var(--g2) - 30),
        		calc(var(--b2) - 30)
        	);
        	--col2-3: rgb(
        		calc(var(--r2) - 20),
        		calc(var(--g2) - 20),
        		calc(var(--b2) - 20)
        	);
        	--col2-4: rgb(
        		calc(var(--r2) - 10),
        		calc(var(--g2) - 10),
        		calc(var(--b2) - 10)
        	);
        	--col2-5: rgb(var(--r2), var(--g2), var(--b2));
        	--col2-6: rgb(
        		calc(var(--r2) + 10),
        		calc(var(--g2) + 10),
        		calc(var(--b2) + 10)
        	);
        	--col2-7: rgb(
        		calc(var(--r2) + 20),
        		calc(var(--g2) + 20),
        		calc(var(--b2) + 20)
        	);
        	--col2-8: rgb(
        		calc(var(--r2) + 30),
        		calc(var(--g2) + 30),
        		calc(var(--b2) + 30)
        	);
        	--col2-9: rgb(
        		calc(var(--r2) + 40),
        		calc(var(--g2) + 40),
        		calc(var(--b2) + 40)
        	);
        	--col2-10: rgb(
        		calc(var(--r2) + 50),
        		calc(var(--g2) + 50),
        		calc(var(--b2) + 50)
        	);
        	--col2-11: rgb(
        		calc(var(--r2) + 60),
        		calc(var(--g2) + 60),
        		calc(var(--b2) + 60)
        	);
        	--col2-12: rgb(
        		calc(var(--r2) + 70),
        		calc(var(--g2) + 70),
        		calc(var(--b2) + 70)
        	);
        	--col2-13: rgb(
        		calc(var(--r2) + 80),
        		calc(var(--g2) + 80),
        		calc(var(--b2) + 80)
        	);
        
        	--col3-00: rg.........完整代码请登录后点击上方下载按钮下载查看