js实现的长方形多层次背景效果-html代码-BFW代码库

js实现的长方形多层次背景效果

代码语言：html

所属分类：背景

代码描述：js实现的长方形背景效果，多层次，多色彩，倾斜状

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

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

<style>
body {
	margin: 0;
}

#content {
	height: 100vh;
	overflow: hidden;
	position: relative;
	width: 100%;
}

.stripes {
	display: block;
	height: 100%;
	left: 0;
	position: absolute;
	top: 0;
	width: 100%;
}

.stripe {
	display: block;
	left: 0;
	position: absolute;
	transform-origin: center center;
	width: 100%;
}

.foreground-stripes {
	z-index: 3;
}

.background-stripes--left {
	left: 0;
	width: 50%;
	z-index: 2;
}

.background-stripes--left {
	right: 0;
	width: 50%;
	z-index: 1;
}
</style>

</head>
<body translate="no">

<main id="content">
<div id="background-stripes--left" class="background-stripes--left stripes"></div>
<div id="background-stripes--right" class="background-stripes--right stripes"></div>
<div id=.........完整代码请登录后点击上方下载按钮下载查看