用户登录

从设计到代码：布局设计

From Design to Code（XD - CSS）：Layout

— 王皓

2025 独立开发者训练营：AI Agent！查看介绍 / 立即报名 →

用 Adobe XD 设计一个页面布局，然后用 HTML 与 CSS 把它表达出来。

封面摄影：Daniel Gastager

介绍
0:00
制作过程（极速快进）
0:32
页面布局（Adobe XD）
0:00
页面布局（XD）：边栏
2:37
页面布局（XD）：页头
1:23
页面布局（XD）：主体
1:46
页面布局（XD）：组件
0:50
页面布局（XD）：小尺寸设备上的页面布局
1:48
页面布局（XD）：滚动页面
1:40
页面布局（代码）
0:00
页面布局（CSS）：创建文档
1:35
页面布局（CSS）：统一浏览器的基础样式
1:42
页面布局（CSS）：布局的基本结构
2:23
页面布局（CSS）：布局网格
2:27
页面布局（CSS）：页头内容布局
1:18
页面布局（CSS）：页头区域里的工具栏
2:27
页面布局（CSS）：页面左边栏
2:24
页面布局（CSS）：页面主体内容不规则网格布局
2:36
页面布局（CSS）：固定在页面上的头部与边栏
1:16
页面布局（CSS）：小尺寸设备上的页面布局
2:14

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网，每天进步一点