css钟表特效代码（css钟表特效代码怎么用）

本篇文章给大家谈谈css钟表特效代码，以及css钟表特效代码怎么用对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。

本文目录一览：

• 1、用html，css，Javascript制作12小时制时钟特效。
• 2、在css中能表示时间的代码是什么
• 3、CSS 代码
• 4、代码：WEB显示时间特效代码

用html，css，Javascript制作12小时制时钟特效。

!DOCTYPE html

html

  head

meta http-equiv="Content-Type" content="text/html; charset=UTF-8"

title技能训练4-5/title

style

div.wrap{

margin: 0 auto;

width:400px;

height:110px;

border:1px solid gray;

}

div.wrap#b{

text-align:center;

font:bolder 30px '宋体';

color:red;

background-color:gray;

height:40px;

}

div.wrap#c{

text-align:center;

font:normal 25px '黑体';

}

/style

script

onload=function(){

var c=document.getElementById("c");

setInterval(function(){

var now=new Date;

var y=now.getFullYear();

var M=now.getMonth()+1;

var d=now.getDate();

var h=now.getHours();

var m=now.getMinutes();

var s=now.getSeconds();

var e=now.getDay();

var w;

if(h12){

w="上午";

}else if(w18){

w="下午";

}else{

w="晚上";

}

h=h12?h-12:h;

h=h10?"0"+h:h;

m=m10?"0"+m:m;

s=s10?"0"+s:s;

c.innerHTML=y+"年"+M+"月"+d+"日 星期"+"日一二三四五六".split("")[e]

+"br /"+w+" "+h+":"+m+":"+s;

},1000);

}

/script

  /head

body

    div class="wrap"

div id="b"

 span我的小时钟/span

/div

div id="c"

/div

/div

  /body

/html

在css中能表示时间的代码是什么

代表时间的代码不是在css中，css是一种样式，比如你在做网站的时候，前端html布局了一个页面，感觉不太美观的时候用css样式来控制一下，使其页面更加的美化与易懂；

而代表时间的代码是html中的time(英语也是"时间"的意思)time时间是：******/time

time中属性：datetime 值：datetime

time描述：定义元素的日期和时间。如果未定义该属性，则必须在元素的内容中规定日期或时间。

CSS 代码

当然要加

Class

因为你上面是这样定义的

.m

调用的时候就必须以Class来调用;

再举个例子:

比如你写CSS是这样写:

#MainMenu

{

font-size:12px;

}

在调用的时候可以直接这样写

div

id="MainMenu"测试/div

而你定义的时候是这样定义

.MainMenu

{

font-size:12px;

}

则你调用就要这样调用:

div

Class="MainMenu"测试/div

效果一样.只是调用上有区别;

同时像有些标签的定义,则不必来特意指定,只需要指定前一个CSS就可以了.如

#MainMenu

{

font-size:12px;

}

#MainMenu

img

{

border:0px;

}

调用

div

id="MainMenu"测试啊img

src=1.gif/div

则在DIV中IMG对象自动将边框变为了0;

代码：WEB显示时间特效代码

var now = new Date();

var year = now.getFullYear();

var month = now.getMonth();

var day = now.getDate();

var dateValue = year;

dateValue += ((month 9) ? "-0" : "-") + (month + 1);

dateValue += ((day 10) ? "-0" : "-") + day;

var hours = now.getHours();

var minutes = now.getMinutes();

var seconds = now.getSeconds();

var timeValue = ((hours 10) ? "0" : "") + hours ;

timeValue += ((minutes 10) ? ":0" : ":") + minutes;

timeValue += ((seconds 10) ? ":0" : ":") + seconds;

用上面这些JS代码获取你要的时间日期,再将获取到的值显示到你要显示的地方,显示的样式

可以再用CSS控制.

关于css钟表特效代码和css钟表特效代码怎么用的介绍到此就结束了，不知道你从中找到你需要的信息了吗 ？如果你还想了解更多这方面的信息，记得收藏关注本站。