css+svg实现底部菜单栏点击加号伸缩弹出子菜单图标效果代码-html代码-BFW代码库

css+svg实现底部菜单栏点击加号伸缩弹出子菜单图标效果代码

代码语言：html

代码描述：css+svg实现底部菜单栏点击加号伸缩弹出子菜单图标效果代码

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

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <style>
        @import url("https://fonts.googleapis.com/css?family=Roboto");
    	* {
    	box-sizing:border-box;
    }
    :root {
    	--bg:#F5F5F6;
    	--primary:#d81b60;
    	--secondary:#4a148c;
    	--icon-color:white;
    }
    body {
    	font-family:'Roboto',sans-serif;
    	background-color:var(--bg);
    	height:100vh;
    	margin:0;
    }
    p {
    	font-size:2em;
    	padding-left:1em;
    }
    svg {
    	width:1em;
    }
    footer {
    	position:absolute;
    	left:0;
    	bottom:0;
    	width:100%;
    	padding:1.2em 0.7em;
    	user-select:none;
    }
    .closed ~ .footer-bg::after {
    	width:70px;
    }
    .footer-bg {
    	position:absolute;
    	top:0;
    	left:0;
    	width:100%;
    	heigh.........完整代码请登录后点击上方下载按钮下载查看