尧图整理十年网页设计一线经验，从 HTML 入门到版式美学，从配色原理到工具实操，陪你一步步把设计做成可复用的手艺。
从基础到进阶，从理论到实操，每一块都对应一套独立的方法论与案例。
MODULE 01
HTML 语义化、CSS 选择器、盒模型、浮动与定位……把网页骨架与样式一点点拆给你看，零基础也能跟上。
进入教程 →
MODULE 02
按钮、卡片、表单、图标，每一个组件背后都有可拆解的细节逻辑。
查看技巧 →
MODULE 03
色彩理论、情绪表达、主辅点缀的比例，让页面色彩有节奏。
学习配色 →
MODULE 04
栅格、留白、视觉层级与节奏感，决定页面是否耐看、是否好用。我们从原理讲到落地。
进入版式 →
MODULE 05
Figma、Sketch、PS、VS Code，工具是手艺的延伸。
查看指南 →
MODULE 06
拆解真实项目，看每个设计决策背后的逻辑。
查看案例 →从最常被问到的知识点开始，循序渐进建立完整知识体系。
入门 BASIC · HTML
从 header、main 到 article，理解每个标签背后的语义意图，让结构更清晰。
入门 BASIC · CSS
搞懂 margin、border、padding、content 的关系，掌握选择器优先级。
进阶 LAYOUT
两种现代布局方案的取舍与搭配，从单行卡片到复杂页面骨架。
进阶 RESPONSIVE
移动优先 vs 桌面优先，断点怎么选，媒体查询怎么写更稳。
进阶 TYPOGRAPHY
字号阶、行高、字距与对比，决定内容的可读性与气质。
实战 ANIMATION
transition、transform、keyframes，让交互更有温度。
从真实项目里提炼出来的可用配色，每组都标注了主辅点缀的比例与适用场景。
PALETTE 01
浅绿+奶白，适合健康、自然、教育类页面，传达温和与生长感。
PALETTE 02
浅蓝+奶白，适合科技、金融、SaaS 类页面，传达信任与专业。
PALETTE 03
绿蓝交织+奶白，适合生活方式、设计工作室类页面，传达柔软与细腻。
每个工具只讲最常用的 20% 功能，解决 80% 的日常需求。
持续分享网站设计一线的方法、踩坑与思考。
![【Bug已解决】[modular] ensure branch-specific input defaults 解决方案](http://pic.xiahunao.cn/yaotu/【Bug已解决】[modular] ensure branch-specific input defaults 解决方案)
