css布局实现游戏手柄点击按钮换背景色动画效果代码-html代码-BFW代码库

css布局实现游戏手柄点击按钮换背景色动画效果代码

代码语言：html

代码描述：css布局实现游戏手柄点击按钮换背景色动画效果代码

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

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <style>
     :root {
	--green:#B5E27C;
	--blue:#6AC3D5;
	--light-green:#95DD62;
	--grey:#DBD1C7;
	--pink:#D9BCCD;
	--yellow:#DFD379;
	--red:#D2636E;
	--brown:#9B7188;
	--dark:#53243D;
	--rgbap:rgba(0,0,0,0.2);
	--rgbab:rgba(255,255,255,0.5);
	--stroke:6px solid #53243D;
	--radius:50%
}
input {
	display:none
}
body {
	height:100%;
	overflow:hidden
}
button,label {
	cursor:pointer;
	outline:0
}
button:active {
	transform:scale(.9)
}
.center {
	position:absolute;
	left:50%;
	top:50%;
	transform:translate(-50%,-50%)
}
.joystick {
	width:573px;
	height:261px;
	transform-origin:center
}
.left-hand,.right-hand {
	background-color:var(--grey);
	border-radius:var(--radius);
	width:261px;
	height:261px;
	border:var(--stroke);
	position:absolute;
	top:0;
	z-index:;
	box-shadow:inset 0 -6px var(--rgbap)
}
.right-hand {
	right:0
}
.body-control {
	background-color:var(--grey);
	border-top:var(--stroke);
	z-index:9;
	position:abso.........完整代码请登录后点击上方下载按钮下载查看