动态模糊弹出层效果

代码语言:html

所属分类:弹出层

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<title> - Motion Blur Experiment</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/5.0.0/normalize.min.css">
<style>
    @import url("https://fonts.googleapis.com/css?family=Roboto:400,700,300");
.input-submit,
.open-modal {
  background: #c41;
  border: none;
  color: #eeeaea;
  font-family: "Roboto", sans-serif;
  font-weight: 700;
  outline: none;
}
* {
  box-sizing: border-box;
}
a {
  color: inherit;
}
body {
  background: #eeeaea;
  color: #334;
  font-family: roboto;
  overflow: hidden;
}
body::before {
  content: "";
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  background: rgba(10,0,0,0.1);
}
h1,
h2,
h3 {
  font-weight: 300;
  margin: 0;
}
.icon {
  font-size: 60px;
.........完整代码请登录后点击上方下载按钮下载查看

网友评论0