效果预览点击右侧“点击预览”按钮可在当前页面预览，点击链接可预览全文屏幕。https://codepen.io/comehop??e/pen/gBwzKR互动视频本视频为互动视频，您可以随时暂停视频，编辑视频中的代码。请使用chrome、safari、edge打开观看。https://scrimba.com/p/pEgDAM/ca82VAM源码下载日常前端实战系列完整源码请到github下载：https://github.com/comehop??e/front-end-daily-challenges代码解读这里项目中没有自定义dom元素，使用系统默认的
元素作为容器。定义页面大小并将背景设置为黑色：body{margin:0;宽度：100vw；高度：100vh；background-color:black;}绘制两条灰色细线，一横一竖，线性渐变：body{margin:0;宽度：100vw；高度：100vh；背景色：黑色；background-image:linear-gradient(tobottom,#5552vmin,transparent2vmin),linear-gradient(toright,#5552vmin,transparent2vmin);}在左上角用径向渐变画一个白点：body{保证金：0；宽度：100vw；高度：100vh；背景色：黑色；背景图像：径向渐变（圆形1vmin1vmin，白色1vmin，透明1vmin），线性渐变（到底部，#5552vmin，透明2vmin），线性渐变（到右边，#5552vmin，透明2vmin）；}平铺背景：正文{边距：0；宽度：100vw；高度：100vh；背景色：黑色；背景图像：径向渐变（圆形1vmin1vmin，白色1vmin，透明1vmin），线性渐变（到底部，#5552vmin，透明2vmin），线性渐变（到右边，#5552vmin，透明2vmin）；background-size:10vmin10vmin;}为避免点粘附在左侧和顶部，向背景添加一点偏移：body{margin:0;宽度：100vw；高度：100vh；背景颜色：黑色；背景图像：径向渐变（圆形1vmin1vmin，白色1vmin，透明1vmin），线性渐变（到底部，#5552vmin，透明2vmin），线性渐变（到右边，#5552vmin，透明2vmin）；背景大小：10vmin10vmin；背景位置：5vmin5vmin；}现在，如果您在页面上四处移动眼睛，您会看到小黑点，这实际上是一种视错觉，您就完成了！