.clr:after{clear:bothdisplay:blockoverflow:hiddenheight:0content:"."}
.clr{zoom:1}
.time{background:#d8655bwidth:400pxheight:200pxpadding:40px}
.time div{float:leftwidth:60pxheight:60pxline-height:60pxtext-align:centerbackground:#fde8e6color:#d8655bborder-radius:4pxmargin:5pxfont-size:24px}
</style>
<div class="time clr">
<div id="hour"></div>
<div id="minute"></div>
<div id="second"></div>
</div>
<script type="text/javascript">
setInterval(function (){
var date = new Date()
document.getElementById('hour').innerText = (('0'+ (date.getHours())).slice(-2))
document.getElementById('minute').innerText = (('0'+ (date.getMinutes())).slice(-2))
document.getElementById('second').innerText = (('0'+ (date.getSeconds())).slice(-2))
}, 1000)
</script>
代表时间的代码不是在css中，css是一种样式，比如你在做网站的时候，前端html布局了一个页面，感觉不太美观的时候用css样式来控制一下，使其页面更加的美化与易懂；而代表时间的代码是html中的time(英语也是"时间"的意思)<time>时间是：******</time>
time中属性：datetime 值：datetime
time描述：定义元素的日期和时间。如果未定义该属性，则必须在元素的内容中规定日期或时间。
<html><head>
<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312">
<meta name="keywords" content="js特效" />
<meta name="description" content="js特效网" />
<title>年月日分秒全部显示的时间代码</title>
</head>
<body onload=startclock()>
<form name="clock">
<script language="JavaScript">
var timerID = null
var timerRunning = false
function stopclock (){
if(timerRunning)
clearTimeout(timerID)
timerRunning = false}
function startclock () {
stopclock()
showtime()}
function showtime () {
var now = new Date()
var hours = now.getHours()
var minutes = now.getMinutes()
var seconds = now.getSeconds()
var timeValue = now.getYear()+"年"+(now.getMonth()+1)+"月"+now.getDate()+"日" +((hours >= 12) ? " 下午 " : " 上午 " )
timeValue += ((hours >12) ? hours -12 :hours)
timeValue += ((minutes <10) ? ":0" : ":") + minutes
timeValue += ((seconds <10) ? ":0" : ":") + seconds
document.clock.thetime.value = timeValue
timerID = setTimeout("showtime()",1000)
timerRunning = true}
</script>
<input name="thetime" style="font-size: 9ptcolor:#000000border:1px solid #FFFFFF" size="28"></form>
</body>
</html>
