/Mini-Web-Projects

Mini web projects practice with Chinese annotation using HTML, CSS & JS

Primary LanguageCSS

Mini-Web-Projects

带有中文注释的迷你 Web 项目练习,一起来学前端吧!

简介

在学习前端的过程中,理论知识总是难以记忆和容易遗忘的,所以需要进行一定的项目练习来加深理解和加强记忆。所以本仓库收录吸收了许多个人认为适合新手练习、规模较小、质量较高的 Web 项目,并加上了中文注释。

本仓库的所有项目几乎都经过个人理解的优化或重构,删去了一些冗余代码或重构过于复杂的逻辑和实现方式,也有可能在原项目的基础上增加一些功能。

注:本仓库大部分项目规模只能对应着一个完整网页的某一个模块或组件

谁适合本仓库

正在学习前端的初学者,对基础知识掌握不牢、理解不深,对具体实践有困难的各类人群,任何想巩固提高自己前端水平的学习者。

但由于本仓库的项目脱离前端框架,只基于 HTML、CSS & JS 实现,所以几乎只适合于正在学习前端基础的人群。

学习从模仿开始,运用自己所学,做一些酷炫的效果吧!

项目列表

# 项目 在线预览
01 Expanding Cards 在线预览
02 Progress Steps 在线预览
03 Hide Side Navigation 在线预览
04 Hidden Search 在线预览
05 Animation In Scroll 在线预览
06 Split Landing Page 在线预览
07 Login Panel 在线预览
08 Asynchronous Function 在线预览
09 Collapsed Card 在线预览
10 2.5D Button 在线预览
11 Increasing Number 在线预览
12 Movie App 在线预览
13 Clock 在线预览

关于

由于本人水平有限,项目中难免会有错误,你的勘误对我来说是很大的帮助。

如果你有好的,适合新手的项目,也欢迎添加至本仓库。