响应式网站设计.ppt

文档介绍：Responsive Web Design响应式网站设计
徐延辉
2013年1月30日
移动设备正超过桌面设备,成为访问互联网的最常见终端。于是,网页设计师不得不面对一个难题:如何才能在不同大小的设备上呈现同样的网页?
Responsive Web Design
这个词有多个翻译:
反馈式设计?
交互式设计?
自适应网页设计?
响应式网页设计?
哪个翻译最接近?
“响应式网站设计”的概念?
他给的定义是指可以自动识别屏幕宽度、并做出相应调整的网页设计。
2010年,Ethan Marcotte提出了“Responsive Web Design”这个名词,
Ethan Marcotte制作的一个范例
他制作了一个范例,里面是《福尔摩斯历险记》六个主人公的头像。
如果屏幕宽度大于1300像素,则6张图片并排在一行。
Ethan Marcotte制作的一个范例
则6张图片分成两行
如果屏幕宽度在600像素到1300像素之间
Ethan Marcotte制作的一个范例
则导航栏移到网页头部
如果屏幕宽度在400像素到600像素之间
Ethan Marcotte制作的一个范例