jquery实现一个日程安排待办事项的日历效果代码
代码语言:html
所属分类:布局界面
代码描述:jquery实现一个日程安排待办事项的日历效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <style> button { margin: 0; font: inherit; color: inherit; overflow: visible; text-transform: none; border: none; text-align: center; } ul,li { list-style: none; margin: 0; padding: 0; } .rightPart2 { width: 440px; height: 414px; border: 1px #ccc solid; } /* 我的日程 */ .title2 { height: 40px; line-height: 40px; border-bottom: 1px #c7c7c7 solid; padding-left: 20px; } .today { width: 40px; height: 24px; line-height: 24px; text-align: center; background: #e0f2ff; color: #666; border-radius: 2px; float: right; margin-right: 30px; margin-top: 8px; cursor: pointer; } .schedule { width: 100%; } .dateShow { border-bottom: 1px #dbdbdb solid; height: 125px; } table.dates { width: 100%; margin-top: 8px; } table.dates tr th { padding: 5px; color: #666; font-weight: normal !important; } table.dates tr th, table.dates tr td { text-align: center; } table.dates tr td { padding: 6px 0; cursor: pointer; } table.dates tr th button { padding: 6px; cursor: pointer; width: 24px; height: 24px; } .lastM { background: #fff url(//repo.bfw.wiki/bfwrepo/images/nav/double-left.png) no-repeat; background-position: 0 8px; } .lastW { background: #fff url(//repo.bfw.wiki/bfwrepo/images/nav/pre.png) no-repeat; background-position: 5px 8px; } .nextW { background: #fff url(//repo.bfw.wiki/bfwrepo/images/nav/next.png) no-repeat; background-position: 5px 8px; } .nextM { background: #fff url(//repo.bfw.wiki/bfwrepo/images/nav/double-right.png) no-repeat; background-position: 14px 8px; } table.dates tr td button { /* width:24px; */ height: 24px; line-height: 24px; text-align: center; background: #fff; cursor: pointer; } .mark1 { background: #028BE0 !important; color: #fff; border-radius: 2px; } .mark2 { background: url(//repo.bfw.wiki/bfwrepo/images/nav/spoint.png) no-repeat top; } .padleft { padding-left: 38px !important; } .padright { padding-right: 38px !important; } .tl { text-align: left !important; } .tr { text-align: right !important; } .detailed { padding: 10px 16px; height: 220px; overflow: hidden; overflow-y: auto; } .rclist { overflow: hidden; padding-bottom: 20px; } .detailed ul li {} .detailed ul li span { display: inline-block; color: #666; } .detailed ul li { width: 100%; /* position: relative; */ float: left; margin-bottom: 10px; } .time { width: 60px; float: left; background: url(//repo.bfw.wiki/bfwrepo/images/nav/point.png) no-repeat left; padding-left: 14px; } .explain { width: 310px; float: left; /* position: absolute; left:60px; top:0; */ } .........完整代码请登录后点击上方下载按钮下载查看
网友评论0