一个div+css布局实现敏捷狐狸效果代码
代码语言:html
所属分类:布局界面
代码描述:一个div+css布局实现敏捷狐狸效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
body {
min-height: 300px;
height: 100vh;
position: relative;
background-color: #ff6347;
text-align: center;
}
div {
position: absolute;
left: 50%;
top: 50%;
}
div:before,
div:after {
display: block;
content: '';
position: absolute;
}
#quick {
width: 18em;
height: 9em;
margin-left: -9em;
margin-top: -1.5em;
background-repeat: no-repeat;
background-image: radial-gradient(circle at 50% 13em, rgba(160,82,45,0) 60%, #a0522d 60.1%), radial-gradient(ellipse at 100% 120%, transparent 65%, #703a20 65.5%), radial-gradient(ellipse at 0 120%, transparent 65%, #703a20 65.5%), radial-gradient(circle, black 50%, rgba(0,0,0,0) 51%), radial-gradient(circle, black 50%, rgba(0,0,0,0) 51%), radial-gradient(ellipse, black 50%, rgba(0,0,0,0) 52%), radial-gradient(ellipse, rgba(255,255,255,0.5) 50%, rgba(255,255,255,0) 51%), radial-gradient(ellipse at 50% 20%, #f5deb3 60%, rgba(255,255,25.........完整代码请登录后点击上方下载按钮下载查看
网友评论0