css+js实现墙壁射灯下的时钟挂钟指针走动显示时间效果代码-html代码-BFW代码库

css+js实现墙壁射灯下的时钟挂钟指针走动显示时间效果代码

代码语言：html

所属分类：其他

代码描述：css+js实现墙壁射灯下的时钟挂钟指针走动显示时间效果代码

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

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

<head>

  <meta charset="UTF-8">

  
  
  
  
<style>
body {
	background-color: #dfdad4;
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
}
.clock {
	position: relative;
	border-radius: 100%;
	box-shadow: 2px 10px 10px 10px rgba(0, 0, 0, 0.3),
		inset 2px 20px 10px 10px rgba(0, 0, 0, 0.3);
}
.wrap {
	width: 250px;
	height: 250px;
	border-radius: 100%;
}
.ringbit {
	position: absolute;
	width: 150px;
	height: 350px;
	border: 20px solid transparent;
	border-radius: 90px;
	margin: auto;
	left: 0;
	bottom: 0;
	right: 0;
	top: 0;
	border-bottom: 20px solid white;
}
.ringbit:before {
	content: "";
	position: absolute;
	width: 150px;
	height: 350px;
	border: 20px solid transparent;
	border-radius: 90px;
	margin: auto;
	left: -15%;
	bottom: 0;
	right: 0;
	top: 5%;
	border-bottom: 20px solid rgba(0, 0, 0, 0.2);
	filter: blur(5px);
.........完整代码请登录后点击上方下载按钮下载查看