每日一题：全球新冠疫情数据统计
全球新冠疫情数据统计介绍新冠疫情席卷全球，在此期间有很多免费的 API 和网站为人们提供了各个国家疫情数据的查询功能，这些免费公开的数据体现出了互联网作为信息媒介的优越性，帮助全球人民更好的了解一线疫情信息。
本题请实现一个可以对各个国家的新冠疫情数据统计的页面。
准备开始答题前，需要先打开本题的项目代码文件夹，目录结构如下：
123456789├── css│ └── style.css├── effect.gif├── index.html└── js ├── axios.js ├── covid-data.json ├── echarts.min.js └── vue.js
其中：
css/style.css 是样式文件。
index.html 是主页面。
js/axios.js 是 axios 文件。
js/vue.min.js 是 vue2.x 文件。
js/echarts.min.js 是 echarts 文件。
js/covid-data.json 是页面所用到的新冠数据。
effect.gif 是页面最终的效果图。
注意：打开环境后发现缺 ...
每日一题：抢红包啦
抢红包啦介绍小蓝想给同学们发一个红包，慰劳大家学习前端的辛苦，可是到了开红包这一步，大家收到的红包金额列表竟然一片空白，这可急坏了小蓝，快来帮小蓝解决这个问题吧！
准备开始答题前，需要先打开本题的项目代码文件夹，目录结构如下：
1234567├── css├── effect.gif├── images├── index.html└── js ├── index.js └── randomAllocation.js
其中：
index.html 是主页面。
images 是图片文件夹。
css 是样式文件夹。
js/index.js 是项目的 js 文件。
js/randomAllocation.js 是需要补充代码的 js 文件。
effect.gif 是项目完成的效果图。
注意：打开环境后发现缺少项目代码，请手动键入下述命令进行下载：
1wget https://labfile.oss.aliyuncs.com/courses/18421/red_envelope.zip && unzip red_envelope.zip && rm ...
每日一题：凭空消失的TA
凭空消失的 TA介绍在使用 element-ui 开发的过程中，表单组件的使用相当频繁，其使用方式也比较简单，只要根据官网示例操作即可掌握。不过刚开始使用它的小蓝却遇到了一个问题：本来一个完整的表单已经出现在页面上了，可是调皮的小猫跳到键盘上一顿“操作”后表单凭空消失了……机智的你来帮他查找原因并修复这个 bug 吧～
准备本题已经内置了初始代码，打开实验环境，目录结构如下：
12345678├── element-ui-2.15.10│ ├── index.css│ └── index.js├── index.html├── js│ ├── http-vue-loader.js│ └── vue.min.js└── myform.vue
其中：
index.html 是主页面。
myform.vue 是封装的表单组件文件。
js 是用于存放 Vue.js 相关文件的文件夹。
element-ui-2.15.10 是存放 element-ui 的文件夹。
选中 index.html 右键启动 Web Server 服务（Open with Live Server）， ...
每日一题：萌宠小玩家
萌宠小玩家介绍萌宠小玩家是一款宠物养成类游戏，玩家在游戏中，可以通过给宠物换衣服、跟它玩、吃零食跟宠物进行互动交流。在萌宠小玩家中，玩家可以体验到养成宠物的乐趣，同时也可以结交新朋友，分享自己的养宠心得，是一款适合所有年龄段玩家的休闲娱乐游戏。
准备开始答题前，需要先打开本题的项目代码文件夹，目录结构如下：
123456├── css├── effect.gif├── images├── index.html└── js └── index.js
其中：
index.html 是主页面。
css 是存放项目样式的文件夹。
images 是存放项目图片的文件夹。
effect.gif 是项目完成后的效果图。
js/index.js 是需要补充代码的 js 文件。
注意：打开环境后发现缺少项目代码，请手动键入下述命令进行下载：
12cd /home/projectwget https://labfile.oss.aliyuncs.com/courses/18421/pet.zip && unzip pet.zip && rm pet.zip
在浏览 ...
每日一题：蓝桥知识网
蓝桥知识网介绍蓝桥为了帮助大家学习，开发了一个知识汇总网站，现在想设计一个简单美观的首页。本题请根据要求来完成一个首页布局。
准备开始答题前，需要先打开本题的项目代码文件夹，目录结构如下：
12345├── css│ └── style.css├── data.txt├── index.html└── mark.png
其中：
css/style.css 是样式文件。
data.txt 是页面数据文件。
index.html 是主页面。
mark.png 是页面参数标注图。
注意：打开环境后发现缺少项目代码，请手动键入下述命令进行下载：
12cd /home/projectwget https://labfile.oss.aliyuncs.com/courses/9791/06.zip && unzip 06.zip && rm 06.zip
目标请根据 mark.png 图片上的参数标注，补充 css/style.css 和 index.html 文件中的代码。对于 mark.png 上未标注的参数，请结合效果图自行调整。
页面版心宽度为 10 ...
每日一题：蓝桥校园一卡通
蓝桥校园一卡通介绍每年大一新生报道时，都需要办一张校园一卡通，无论吃饭、洗澡、买东西、甚至去图书馆借书都要用，小蓝想帮助学校做一个制卡界面，但是用 js 做用户输入验证不知道怎么写，快来帮助小蓝完成这个页面吧！
准备本题已经内置了初始代码，打开实验环境，目录结构如下：
123456├── css│ ├── wish.css │ └── index.css├── images │ └── college.jpg └── index.html
其中：
index.html 是主页面。
images 是图片文件夹。
css 是样式文件夹。
注意：打开环境后发现缺少项目代码，请复制下述命令至命令行进行下载。
1wget https://labfile.oss.aliyuncs.com/courses/18164/card.zip && unzip card.zip && rm card.zip
在浏览器中预览 index.html 页面，显示如下所示：
在初始化的时候输入框并没有做验证，卡片内容也无法正常显示。
目标请在 index.htm ...
每日一题：课程列表
课程列表介绍分页是前端页面中必不可少的一项功能，下面让我们一起来完成一个课程列表的分页吧。
准备开始答题前，需要先打开本题的项目代码文件夹，目录结构如下：
12345678├── css│ └── bootstrap.css├── effect.gif├── index.html└── js ├── axios.js ├── carlist.json └── index.js
其中：
css/bootstrap.css 是项目中用到 bootstrap 样式文件。
index.html 是主页面。
js/carlist.json 是请求需要用到的数据。
js/axios.js 是请求需要用到的 axios 文件。
js/index.js 是需要补充的 js 文件。
effect.gif 是最终效果图。
注意：打开环境后发现缺少项目代码，请手动键入下述命令进行下载：
12cd /home/projectwget https://labfile.oss.aliyuncs.com/courses/9791/10.zip && unzip 10.zip ...
每日一题：关于你的欢迎语
关于你的欢迎语介绍营销号，有时候需要一些特定的欢迎语，但针对特定的用户，我们希望可以个性化一点。本题需要在项目文件中修改代码存在的问题，实现根据模版生成特定用户的欢迎语。
准备本题已经内置了初始代码，打开实验环境，目录结构如下：
1234567├── css│ ├── bootstrap.min.css│ └── style.css├── js│ ├── bootstrap.bundle.min.js│ └── index.js└── index.html
其中：
css/style.css 是页面样式文件。
css/bootstrap.min.css 和 js/bootstrap.bundle.min.js 是 Bootstrap 相关文件。
js/index.js 是页面功能实现的逻辑代码。
index.html 是页面布局。
选中 index.html 右键启动 Web Server 服务（Open with Live Server），让项目运行起来。打开环境右侧的【Web 服务】，就可以在浏览器中看到如下错误显示，当前显示没有正确获取到输入的用户、课程、平台 ...
每日一题：恶龙与公主
恶龙与公主介绍恶龙与公主是一个很经典的故事，恶龙抓住公主关在自己的洞府内，骑士激斗并战胜恶龙最后解救公主。下面我们通过编码模拟出这个场景：
公主被关在地图中央，骑士最开始在二维地图 [0,0] 的位置，恶龙位置和数量随机生成，左下角固定位置有天使，骑士初始血量为 3。
点击“马上营救”按钮，系统随机生成 1-3 步，骑士按照随机生成的步数进行移动（蓝色边框位置变换）。
若骑士停留位置（红色边框 class 包含 active）有恶龙，则进行战斗并扣除 2 点血量。
若骑士停留位置（蓝色边框 class 包含 active）有天使，则增加 3 点血量。
如果血量小于等于 0，则弹出红色背景提示框，提示重伤不治。
如果骑士（蓝色边框 class 包含 active）顺利到达公主的位置，则弹出绿色背景提示框，提示营救成功。
准备开始答题前，需要先打开本题的项目代码文件夹，目录结构如下：
1234567├── effect-1.gif├── effect-2.gif├── css├── index.html├── images└── js └── index.js
其中：
inde ...
每日一题：动态的Tab栏
动态的 Tab 栏介绍日常在使用移动端 APP 或访问 PC 端网站的时候，常常发现在一些有工具栏或者 Tab 栏的页面会有顶栏固定的效果。简单来说，在页面未开始滚动时顶栏处在其原有的位置上，当页面向下滚动一定区域后，顶栏会跟随滚动固定在页面上方。
本题请实现一个顶栏固定的课程网站首页。
准备本题已经内置了初始代码，打开实验环境，目录结构如下：
123456789101112├── css│ └── style.css├── effect.gif├── images│ ├── C++_course.png│ ├── VSCode.png│ ├── about.png│ ├── linux_course.png│ └── python_course.png├── index.html└── js └── index.js
其中：
css/style.css 是样式文件。
index.html 是主页面。
js/index.js 是页面的 js 文件。
effect.gif 是最终完成的效果图。
images 文件夹下是项目中用到的图片文件。
注意：打开环 ...