制作个人简介卡片
Learn how to create a stylish personal profile card with avatar, social links, and gradient backgrounds. Perfect for your portfolio or resume page.
响应式导航栏
Build a fully responsive navigation bar with hamburger menu, dropdown effects, and smooth transitions. Works on mobile, tablet, and desktop.
登录表单设计
Design a beautiful login form with input validation styles, floating labels, and a modern glassmorphism aesthetic. A must-have for any web app.
产品展示页
Create an attractive product showcase page with pricing cards, feature lists, and call-to-action buttons. Great for landing pages and e-commerce.
倒计时页面
Make a dynamic countdown timer page with animated number cards, event info, and festive styling. Ideal for launch events and promotions.
图片画廊
Build a responsive image gallery with CSS Grid, hover overlay effects, and lightbox-style previews. Perfect for photography portfolios.
CSS Animations
Master CSS animations with @keyframes, transforms, transitions, and performance tips. Create stunning visual effects without JavaScript.
CSS Custom Properties
Learn CSS variables for theming, maintainable code, and dynamic design. Complete guide with practical examples.
Web Accessibility
Make your websites accessible to everyone. Learn semantic HTML, ARIA, keyboard navigation, and WCAG standards.
HTML Forms Guide
Complete guide to HTML forms — input types, validation, labels, security, and beautiful CSS styling techniques.
JavaScript DOM
Learn to manipulate the DOM with vanilla JavaScript. Select elements, handle events, create interactive pages.
Git for Beginners
Learn Git version control from scratch. Master commits, branches, merging, and GitHub collaboration workflows.
VS Code Tips
Boost your productivity with VS Code shortcuts, extensions, Emmet, multicursor, and built-in Git integration.
Frontend Roadmap
Complete 2025 frontend developer roadmap — from HTML basics to React, portfolio projects, and job preparation.