css实现浮动式弹出菜单导航效果代码
代码语言:html
所属分类:菜单导航
代码描述:css实现浮动式弹出菜单导航效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!doctype html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
@import url(http://fonts.useso.com/css?family=Lato);
body {
margin:0;
padding:0;
background-color:#222;
}
* {
color:#888;
font-family:"Lato",Helvetica,sans-serif;
}
.bar {
display:block;
width:40px;
height:5px;
margin:5px auto;
background-color:#fff;
border-radius:2px;
transition:all 0.4s linear 0.1s;
-webkit-transition:all 0.4s linear 0.1s;
-moz-transition:all 0.4s linear 0.1s;
-o-transition:all 0.4s linear 0.1s;
-ms-transition:all 0.4s linear 0.1s;
}
.bar:first-child {
margin-top:27px;
}
.wrap {
position:absolute;
top:20px;
left:20px;
margin:auto;
width:150px;
height:100px;
filter:url("../index.html/#filt");
-webkit-filter:url("#filt");
}
.wrap .blob {
display:block;
cursor:pointer;
border:none;
outline:none;
position:absolute;
width:80px;
height:80px;
border-radius:50%;
z-index:10;
background-color:#F44336;
box-shadow:0 0.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0