js+svg实现日历效果代码

代码语言:html

所属分类:其他

代码描述:js+svg实现日历效果代码

代码标签: svg 日历

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


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

<head>

  <meta charset="UTF-8">

  
  
  
  
<style>
body{
	margin:0 auto;
	background:steelblue;
}
#d {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	height:200px;
	width:200px;
	border-radius:13px;
	background:rgba(0,0,0,0.2);
	border:2px solid rgba(255,255,255,0.5);
	padding-top:10px;
	padding-bottom:10px;
}
.left, .right {
	background:none;
	color:#fff;
	padding:0;
	margin:0 auto;
	border:1px solid rgba(255,255,255,0.5);
	height:7.5%;
	width:7.5%;
	font-size:10px;
	line-height:10px;
	cursor:pointer;
	position:absolute;
}
.right{
	top:5%;
	left:10%;
	border-radius:0px 3px 3px 0px;
}
.left{
	top:5%;
	left:3%;
	border-radius:3px 0px 0px 3px;
}
.right:hover, .left:hover{
	opacity:0.7;
}
..........完整代码请登录后点击上方下载按钮下载查看

网友评论0