数字时钟

2023-12-03
考核题目
.数字时钟
.参照下图完成数字时钟的设计与开发
.顶部logo固定定位在页面右上角；底部版权信息固定定位在页面底部、水平居中
.底部请使用个人信息：头像、学号、姓名
.各指针指示刻度和本地时间保持一致，且每秒更新
考核目的
掌握基本的HTML5、CSS3及JavaScript
具备一定的针对具体市场需求的前端开发能力
考核环境
操作系统 Window 10+
文本编辑器 Vs Code
谷歌浏览器 Chrome
评分标准
项目结构
命名规范、结构合理
结构、样式、逻辑三分离
初始化样式、主样式单独创建
页面
弹性盒子 flex
背景图片 background-image
顶部
<a> <h1>
固定定位 fixed
时钟
伪元素 ::before ::after
结构伪类 :nth-child
定位 relative、absolute
弹性盒子 flex
过渡动画 transition
变换 transform
DOM对象、事件侦听、定时器
底部
<footer> <img>
固定定位 fixed
弹性盒子 flex
个人信息：学号、姓名
整体效果
功能
布局
设计
考核要求
独立完成，禁止抄袭
点击下载 实验报告；提交时更新为自己的实际信息；完成后，导出为pdf，以学号+姓名的格式命名，如23001069张树彬.pdf
报告中要体现关键代码和效果截图；代码格式同正文区分开；截图统一宽度，高度随内容；更多格式请参考格式美化
完整项目和实验报告打包压缩后，以学号+姓名的格式命名，如23001069张树彬.rar，提交到学习通；压缩类型不限
抄袭、未按要求开发、提交视为无效作业，不得分