css+jquery实现简单的日历显示当前日期效果代码-html代码-BFW代码库

css+jquery实现简单的日历显示当前日期效果代码

代码语言：html

代码描述：css+jquery实现简单的日历显示当前日期效果代码

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">




    <style>
        
        body {
        	background: #a3a3a3;
        }
        
        #calender {
        	background-color: #ffffff;
        	background-image: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#e3e3e3));
        
        	background-image: -webkit-linear-gradient(top, #ffffff, #e3e3e3);
        	background-image: -moz-linear-gradient(top, #ffffff, #e3e3e3);
        	background-image: -o-linear-gradient(top, #ffffff, #e3e3e3);
        	background-image: -ms-linear-gradient(top, #ffffff, #e3e3e3);
        	background-image: linear-gradient(top, #ffffff, #e3e3e3);
        	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,StartColorStr='#ffffff', EndColorStr='#e3e3e3');
          
          margin: 50px auto;
        	width: 200px;
        	height: 200px;
        	border-radius: 12%;
        	position: relative;
          z-index:0;
        
        	-webkit-box-shadow: inset 0px 0px 2px -1px rgba(0,0,0,.8),0px 1px 1px rgba(20,20,20,.4);
        	box-shadow: inset 0px 0px 2px -1px rgba(0,0,0,.8),0px 1px 1px rgba(20,20,20,.4);
        
          /* Specific static values related to element centering make it imposible to change size of calender by normal means. Use css ransfrom - scale */
          -webkit-transform:scale(1);
          -moz-transform:scale(1);
          -ms-transform:scale(1);
          -o-transform:scale(1);
          transfrom:scale(1);
        }
        
        #calenderTop {
        	background-color: #cc2427;
        	width: 100%;
        	height: 32%;
        	position: absolute;
        	z-index: 1;
          
          display: table;
          
        	border-top-left-radius: 22px;
        	border-top-right-radius: 22px;
        	border-bottom: 2px dashed #940000;
        
        	-webkit-box-shadow: 0px 2px 0px #CC2427,0px 3px 0px #6B0C0C,inset 0px 1px 5px -1px rgba(0,0,0,.4);
        	box-shadow: 0px 2px 0px #CC2427,0px 3px 0px #6B0C0C,inset 0px 1px 5px -1px rgba(0,0,0,.4);
        }
        
        #calender > div#otherPages {
        	content: '';
        	width: inherit;
        	height: inherit;
        	background: inherit;
        	border-radius: inherit;
        
        	-webkit-box-shadow: inherit;
  .........完整代码请登录后点击上方下载按钮下载查看