纯css布局实现孤月色效果
代码语言:html
所属分类:布局界面
代码描述:纯css布局实现孤月色效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
* {
margin: 0;
padding: 0;
}
.midnight {
position: relative;
background: linear-gradient(
0deg,
rgba(20, 32, 72, 1) 3%,
rgba(20, 32, 72, 1) 4%,
rgba(77, 90, 130, 1) 33%,
rgba(50, 71, 125, 1) 76%
);
width: 300px;
height: 400px;
margin: 0 auto;
margin-top : 100px;
}
.midnight-sky {
position: absolute;
background: linear-gradient(
180deg,
rgba(44, 1, 108, 1) 8%,
rgba(69, 26, 116, 1) 35%,
rgba(110, 75, 131, 1) 79%,
rgba(137, 106, 140, 1) 92%
);
width: 300px;
height: 200px;
margin: 0 auto;
}
.midnight-moon {
position: absolute;
.........完整代码请登录后点击上方下载按钮下载查看
网友评论0