CSS3 3D时间
来源:互联网 发布:mac os 完全卸载软件 编辑:程序博客网 时间:2024/06/05 05:07
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>3D时间</title> <style> body{ background: #252527; } #time{ text-align: center; position: relative; text-transform: uppercase; color: #252527; font-size: 14vw; letter-spacing: 1.2vw; font-weight: 700; text-shadow: 0 1px 0 #4a4a4e, -1px -1px 0 #4a4a4e, /*main 3d shadow*/ -1px 0px 0 #343437, -2px 1px 0 #343437, -3px 2px 0 #313134, -4px 3px 0 #2f2f31, -5px 4px 0 #2c2c2f, -6px 5px 0 #2a2a2c, -7px 6px 0 #27272a, -8px 7px 0 #252527, -9px 8px 0 #232324, -10px 9px 0 #202022, -11px 10px 0 #1e1e1f, -12px 11px 0 #1b1b1d, -13px 12px 0 #19191a, -14px 13px 0 #161617, -15px 14px 0 #141415, -16px 15px 0 #111112, /*top right*/ 0 -1px 1px #ffffff, 0 -2px 0px #ffffff, /*bottom left corner*/ -15px 14px 0px #ffffff, -16px 15px 0px #ffffff, -17px 16px 0px #ffffff, -18px 17px 0px #ffffff, -2px -1px 0 #ffffff, -3px 0px 0 #ffffff, /*top left corner*/ -19px 15px 0 #ffffff, -18px 14px 0 #ffffff, -17px 13px 0 #ffffff, -16px 12px 0 #ffffff, -15px 11px 0 #ffffff, -14px 10px 0 #ffffff, -13px 9px 0 #ffffff, -12px 8px 0 #ffffff, -11px 7px 0 #ffffff, -10px 6px 0 #ffffff, -9px 5px 0 #ffffff, -8px 4px 0 #ffffff, -7px 3px 0 #ffffff, -6px 2px 0 #ffffff, -5px 1px 0 #ffffff, -4px 0px 0 #ffffff, /*lower right / (upper right side for capital T like H etc letters. */ 0px 2px 0px #ffffff, -1px 3px 0px #ffffff, -2px 4px 0px #ffffff, -3px 5px 0px #ffffff, -4px 6px 0px #ffffff, -5px 7px 0px #ffffff, -6px 8px 0px #ffffff, -7px 9px 0px #ffffff, -8px 10px 0px #ffffff, -9px 11px 0px #ffffff, -10px 12px 0px #ffffff, -11px 13px 0px #ffffff, -12px 14px 0px #ffffff, -13px 15px 0px #ffffff, -14px 16px 0px #ffffff, -15px 17px 0px #ffffff; } </style></head><body> <div id="time"></div></body></html><script> time();// 调用时间切换的函数 function time(){ var time_hours; var time_minutes; var time_seconds; var time_num = new Date(); var time_html = document.getElementById("time"); time_num.getHours()<10 ? time_hours = '0'+time_num.getHours() : time_hours = time_num.getHours(); time_num.getUTCMinutes()<10 ? time_minutes = '0'+time_num.getUTCMinutes() : time_minutes = time_num.getUTCMinutes(); time_num.getSeconds()<10 ? time_seconds = '0'+time_num.getSeconds() : time_seconds = time_num.getSeconds(); time_html.innerText = time_hours+':'+time_minutes+':'+time_seconds; setTimeout(time,1000); }</script>
0 0
- CSS3 3D时间
- css3 3D效果
- CSS3 3D 转换
- CSS3 3D transform
- CSS3 3D Transform
- CSS3-3D-form
- CSS3 3D 变幻
- CSS3 3D Transform
- CSS3 3D
- CSS3 3D效果
- CSS3 3D Transform
- CSS3 3D Transform
- CSS3 Transform 【3D 】
- CSS3 3D 转换
- CSS3 3D变形
- CSS3 3D变换
- [CSS3]3D盒子
- CSS3 3D 转换
- Spring通过SchedulerFactoryBean实现调度任务的配置
- LeetCode 简单操作 | 17. Letter Combinations of a Phone Number
- awk 结束任务计划
- redisRDB持久化
- http请求方式
- CSS3 3D时间
- noSQL数据库redis的安装与测试
- Python二分查找
- du命令 查看目录和文件的磁盘占用情况
- libsvm介绍
- HTTP 响应头信息
- LeetCode 简单操作 | 171. Excel Sheet Column Number
- 介绍Linux目录结构 & Linux分区大小、挂载点 和如何分区
- #######TensorFlow深度学习,一篇文章就够了#########