自适应网站设计如何去设计一个自适应的网页设计或HTMl5

如何利用"自适应网页设计"实现不同的设备上呈现同样的网页

不同设备其主要表现在屏幕的大小不同上，从而显示的效果不一。

比如在屏宽小于768（比如手机设备)时，其在css中可能要进行相应的媒体查询设置相应的css: @media(max-width:768px){ .mycss { padding:0; } } 所以可以针对大多数的设备进行相应的css字义就可以了，当然也可以使用很多的响应式框架进行(如bootstrap, Amaze)，然后有选择性的重定义一些css

响应式设计和自适应设计有什么不同

Responsive design (响应式设计)：建立一个网页，通过CSS Media Queries，Content－Based Breakpoint（基于内容的断点）等技术来改变网页的大小以适应不同分辨率的屏幕。

Adaptive design (自适应设计)：为不同类别的设备建立不同的网页，检测到设备分辨率大小后调用相应的网页。

目前AWD网页主要针对这几种分辨率（320，480，760，960，1200，1600）

响应式设计和自适应设计有什么不同

1、响应式设计简而言之就是一个网站能够兼容多个终端，而不是为每个终端做一个特定的版本。

在这里大家可以理解为做一个网站就能适应多种设备，而不用在为每个设备做一个特定的版本，在不同的设备上展现的模式也不一样。

响应式可以为不同终端的用户提供更舒适的界面和更好的浏览体验。

2、 自适应设计指能使网页自适应显示在不同大小终端设备上新网页设计方式及技术。

大家可以理解为不同大小的设备上呈现同样的页面，让同一个页面适应不同大小屏幕，根据屏幕的大小，自动调整布局。

3、总体来说，响应式设计比自适应设计在功能、体验式更加全面。

响应式网站可以用建站宝盒搭建。

自适应网站一屏式的设计规范是什么？

自适应网站可以建成1920的宽度，一般都是用百分比来控制的，图片宽度尺寸1920像素可以，最终会随着屏幕的大小而自适应。

图片具体的尺寸根据你每个模块分割的尺寸来决定。

比如说首页的轮播图你想全屏显示图片宽度就设置1920PX，轮播图的图片以横构图为主。

一般都建议用横构图，竖构图的话高度不好控制，除非你划分了某个区域是竖构型的。

如何去设计一个自适应的网页设计或HTMl5

如今移动互联网随着3G的普及，越来越火爆，更多需求跟随而来！APP应用市场和APP应用数量成倍成倍的增长！从而给移动互联网带来新的挑战！ 移动设备正超过桌面设备，成为访问互联网的最常见终端。

于是，网页设计师不得不面对一个难题：如何才能在不同大小的设备上呈现同样的网页？ 手机的屏幕比较小，宽度通常在600像素以下；PC的屏幕宽度，一般都在1000像素以上（目前主流宽度是1366×768），有的还达到了2000像素。

同样的内容，要在大小迥异的屏幕上，都呈现出满意的效果，并不是一件容易的事。

很多网站的解决方法，是为不同的设备提供不同的网页，比如专门提供一个mobile版本，或者iPhone / iPad版本。

这样做固然保证了效果，但是比较麻烦，同时要维护好几个版本，而且如果一个网站有多个portal（入口），会大大增加架构设计的复杂度。

于是，很早就有人设想，能不能”一次设计，普遍适用”，让同一张网页自动适应不同大小的屏幕，根据屏幕宽度，自动调整布局（layout）？