求css动态时钟以及日历的代码（运行能用的，没用的不要写上来了，谢谢）（与电脑时间同步）

html-css019

求css动态时钟以及日历的代码（运行能用的，没用的不要写上来了，谢谢）（与电脑时间同步）,第1张

我这里有一段js动态时钟的代码，日历的比较复杂，没有研究：

<scripttype="text/javascript">

setInterval(function() {

var week

var date

var today = new Date()

var year = today.getFullYear()

var month = today.getMonth() + 1

var day = today.getDate()

var ss = today.getDay()

var hours = today.getHours()

var minutes = today.getMinutes()

var seconds = today.getSeconds()

date = year + "年" + month +"月" + day + "日 "

if (ss == 0) week = "星期日"

if (ss == 1) week = "星期一"

if (ss == 2) week = "星期二"

if (ss == 3) week = "星期三"

if (ss == 4) week = "星期四"

if (ss == 5) week = "星期五"

if (ss == 6) week = "星期六"

if (minutes <= 9) minutes ="0" + minutes

if (seconds <= 9) seconds ="0" + seconds

document.getElementById('p_time').innerHTML = "今天是：" + date

+ week + " " + hours + ":" + minutes + ":" +

seconds

},

1000)

</script>

这里一定要注意，html里要有一个id为p_time的div。

在百度搜索中键入关键词“css模板下载”，然后右键将你喜欢的小图标保存下来，平时浏览网页的时候也注意这些细节问题的；

你给出的两张图片一张是分割线，一张是用来平铺的图片，可以搜集也可以自己做；

背景透明的图片如果要用在百度的话就是将你做的图片去掉背景层保存成gif格式然后上传使用就可以了。

是要这种效果吗？

<body>

 <div class="cldBody">

     <table>

        <thead>

             <tr>

                 <td colspan="7">

                     <div class="top">

                         <span id="left">&lt</span>

                         <span id="topDate"></span>

                         <span id="right">&gt</span>

                     </div>

                 </td>

             </tr>

             <tr id="week" >

                 <td>日</td>

                 <td>一</td>

                 <td>二</td>

                 <td>三</td>

                 <td>四</td>

                 <td>五</td>

                 <td>六</td>

             </tr>

         </thead>

         <tbody id="tbody" ></tbody>

     </table>

</div>

27</body>

CSS------------------

<style type="text/css">

    .cldBody{background:#f7f7f7width: 420pxmargin: 10px auto}

    .cldBody .top{height: 60pxline-height: 60pxtext-align: centerposition: relative}

    #topDate{font-size: 24px}

    #week td{font-size: 15px}

    td{width: 60pxheight: 60pxline-height: 60pxtext-align: centerfont-size: 20px}

    #tbody td:hover{background: #edededcursor: pointer}

    .curDate{color: redfont-weight: bold}

    #left,#right{width: 60pxheight: 60pxposition: absolutecursor: pointer}

    #left{left: 0}

    #right{right: 0}

    #left:hover, #right:hover{background-color: rgba(30, 30, 30, 0.2)}

</style>

引入jq

1  <script src="js/jquery-3.4.1.min.js" type="text/javascript" charset="utf-8"></script>

太多了，我建议你看看这个博主的博客，这个是转载这个博客的网页链接望采纳，谢谢