日历之静态页面

最新推荐文章于 2022-05-12 10:09:37 发布

undefined001

最新推荐文章于 2022-05-12 10:09:37 发布

阅读量371

点赞数

分类专栏： JS

本文链接：https://blog.csdn.net/undefined001/article/details/39480169

版权

JS 专栏收录该内容

19 篇文章 0 订阅

订阅专栏

先上图

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style type="text/css">
#calendar{ width:200px; background:pink; overflow:hidden; padding:5px}
#calendar h6{ position:relative; text-align:center; background:#999; height:30px; line-height:30px; padding:0; margin:0}
#calendar h6 span{ position:absolute; background:#666; color:#F00; cursor:pointer}
#calendar h6 span.prev{ left:0}
#calendar h6 span.next{ right:0}
#calendar ul{ padding:0; margin:0; list-style:none;}
#calendar ul li{ float:left; width:25px; border-bottom:1px #666666 solid; border-right: 1px solid #666; background:#ccc; margin:1px; height:25px}
</style>
</head>

<body>
<div id="calendar">
<h6><span class="prev">prev</span>2014年3月<span class="next">next</span></h6>
<ul><li>日</li><li>一</li><li>二</li><li>三</li><li>四</li><li>五</li><li>六</li></ul>
<ul><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li><li>23</li></ul>
</div>
</body>
</html>

undefined001

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
日历之静态页面

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/1999/xhtml">无标题文档#calendar{ width:200px; background:pink; overflow:hidden; padding:5px}#calenda
复制链接

扫一扫

专栏目录