css写一个实时时间 |css默认为hide

.clock{
font-size: 24px;
font-weight: bold;
color: #000;
text-shadow: 1px 3px 3px #ccc;
text-align: center;
}
.clock:before {
content: "\f017";
font-family: FontAwesome;
margin-right: 5px;
}
@keyframes time {
0% { transform: rotateZ(0); }
100% { transform: rotateZ(360deg); }
}
.clock:before {
animation: time 1s infinite linear;
}

上述代码中，大家定义了一个名为“clock”的div元素，该元素包含调整字体大小、粗细等的CSS样式。大家在div前添加了一个Font Awesome图标，以及一个CSS动画，用于旋转图标并实时更新当前时间。

下面是HTML代码：

将上面的CSS放入你的CSS样式表中，将上述HTML代码放入你的网页中即可实现实时时间显示。