<p></p>
body {
margin: 0;
height: 100vh;
background-color: #000000;
display: flex;
justify-content: center;
align-items: center;
}
p {
margin: 0;
color: #fff;
font-size: 10vw;
font-weight: bold;
text-transform: uppercase;
background-image: linear-gradient(to right,
orangered,
orange,
gold,
lightgreen,
cyan,
dodgerblue,
mediumpurple,
hotpink,
orangered);
background-size: 110vw;
font-family: sans-serif;
animation: sliding 30s linear infinite;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
@keyframes sliding {
to {
background-position: -2000vw;
}
}
var tew = document.getElementsByTagName('p')[0];
function getTime() { //获取时间
var date = new Date();
var year = date.getFullYear();
var month = date.getMonth();
var day = date.getDate();
var hour = date.getHours();
var minute = date.getMinutes();
var second = date.getSeconds();
//这样写显示时间在1~9会挤占空间;所以要在1~9的数字前补零;
if (hour < 10) {
hour = '0' + hour;
}
if (minute < 10) {
minute = '0' + minute;
}
if (second < 10) {
second = '0' + second;
}
var x = date.getDay();//获取星期
var time = year + '/' + month + '/' + day + ' ' + hour + ':' + minute + ':' + second
tew.innerHTML = time;//将时间显示在div内
}
getTime();
setInterval(getTime, 1000);