一个时间显示网页

最新推荐文章于 2022-06-17 10:05:13 发布

Vae12138

最新推荐文章于 2022-06-17 10:05:13 发布

阅读量468

点赞数

分类专栏： HTML CSS JS 文章标签： js html css

本文链接：https://blog.csdn.net/Vae12138/article/details/109179119

版权

HTML 同时被 3 个专栏收录

3 篇文章 0 订阅

订阅专栏

CSS

2 篇文章 0 订阅

订阅专栏

2 篇文章 0 订阅

订阅专栏

html页面

<body id="body">
		<div id="div">
			<input type="text" id="txt1" value="" />
		</div>
</body>

CSS样式

* {
	margin: 0;
	padding: 0;
}
			
#body {
	background-color: #000000;
}
			
input {
	border-radius: 20px;
	text-align: center;
	width: 707px;
	height: 196px;
	font-size: 78px;
	box-shadow: -5px 0 100px 0px #168CFA;
	-webkit-box-reflect: below 4px linear-gradient(transparent, transparent 20%, #000);
}
			
#div {
	width: 707px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 400px;
}

js代码

var myVar = setInterval(function() {
				myTimer()
			}, 1000);

			function myTimer() {
				var d = new Date();
				var h = d.toLocaleTimeString();
				var txt = document.getElementById("txt1");
				txt.value = h;
			}

展示效果
在这里插入图片描述

Vae12138

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
一个时间显示网页

html页面<body id="body"> <div id="div"> <input type="text" id="txt1" value="" /> </div></body>CSS样式* { margin: 0; padding: 0;} #body { background-color: #000000;} input { border-radius: 20px; text-alig
复制链接

扫一扫