生成一个网页 全屏黑底白字显示系统当前时间
时间: 2024-05-22 18:12:56 浏览: 6
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>系统当前时间</title>
<style>
body {
background-color: black;
color: white;
font-size: 5rem;
text-align: center;
padding-top: 20%;
}
</style>
</head>
<body>
<script>
function updateTime() {
var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var seconds = now.getSeconds();
var timeString = hours + ":" + minutes + ":" + seconds;
document.body.innerText = timeString;
setTimeout(updateTime, 1000);
}
updateTime();
</script>
</body>
</html>
相关问题
生成一个网页文件可以不联网全屏黑底红色数码管显示本地时间第二行白色显示日期和星期
<!DOCTYPE html>
<html>
<head>
<title>本地时间和日期</title>
<style type="text/css">
body {
background-color: black;
color: red;
font-size: 100px;
text-align: center;
margin: 0;
padding-top: 200px;
}
.date {
color: white;
font-size: 50px;
padding-top: 50px;
}
</style>
</head>
<body>
<script type="text/javascript">
function displayTime() {
var date = new Date();
var hours = date.getHours();
var minutes = date.getMinutes();
var seconds = date.getSeconds();
hours = checkTime(hours);
minutes = checkTime(minutes);
seconds = checkTime(seconds);
document.body.innerHTML = hours + ":" + minutes + ":" + seconds;
setTimeout(displayTime, 1000);
}
function checkTime(i) {
if (i < 10) {
i = "0" + i;
}
return i;
}
function displayDate() {
var date = new Date();
var days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"];
var day = days[date.getDay()];
var month = date.getMonth() + 1;
var dayOfMonth = date.getDate();
var year = date.getFullYear();
document.body.innerHTML += "<div class='date'>" + month + "/" + dayOfMonth + "/" + year + " " + day + "</div>";
setTimeout(displayDate, 86400000);
}
displayTime();
displayDate();
</script>
</body>
</html>
生成一个网页文件可以不联网全屏黑底红色数码管显示本地时间第二行中文白色显示日期和星期
<!DOCTYPE html>
<html>
<head>
<title>本地时间和日期</title>
<style>
body {
background-color: black;
margin: 0;
padding: 0;
}
#time {
color: red;
font-size: 10em;
text-align: center;
margin-top: 100px;
}
#date {
color: white;
font-size: 4em;
text-align: center;
margin-top: 50px;
}
</style>
</head>
<body>
<div id="time"></div>
<div id="date"></div>
<script>
function updateTime() {
var now = new Date();
var hours = now.getHours();
var minutes = now.getMinutes();
var seconds = now.getSeconds();
var time = hours + ":" + minutes + ":" + seconds;
document.getElementById("time").innerHTML = time;
}
function updateDate() {
var now = new Date();
var year = now.getFullYear();
var month = now.getMonth() + 1;
var day = now.getDate();
var dayOfWeek = now.getDay();
var dayOfWeekArray = ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"];
var date = year + "年" + month + "月" + day + "日" + " " + dayOfWeekArray[dayOfWeek];
document.getElementById("date").innerHTML = date;
}
updateTime();
updateDate();
setInterval(updateTime, 1000);
setInterval(updateDate, 1000);
</script>
</body>
</html>
相关推荐
![pdf](https://img-home.csdnimg.cn/images/20210720083512.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)