随着4G的普及，越来越多的人使用移动设备进行沟通交流、购物、学习等信息汲取，随之出现了众多的不同移动设备，如掌上电脑、IPAD、手机等等，面对众多不同型号、不同种类的设备，网页设计师面临着一个大难题，即如何能在不同大小的设备上呈现同样的网页？

很显然，如果要兼顾各种不同的设备尺寸，像以前根据每个不同尺寸进行固定排版肯定行不通。原本针对不同设备设计不同网页的方式，不但要花费大量时间、精力进行重复劳动，且容易出现很多网站维护方面的问题。而自适应作为新的网页布局方式的出现很好的解决了这一问题，自适应式的网站也会成为未来主流网站。

下面我们谈谈什么是自适应？自适应是指在网页应用到不同设备尺寸时，自动识别其屏幕宽度，并做出相应布局调整的网页设计。

例如2列1366像素宽的布局，转到990像素宽度，可自动简化成1列，将左边主要内容转换到图片上面去了，而作为手机页面时，基本上不管是图片还是文字，都以上下模块方式显示，省略了一些不影响主体展示的次要部分，并对部分图片进行了适当的裁切，这就是自适应带给我们的效果展示。

自适应存在的展示方式主要有两种，百分比宽度布局和流式布局。百分比宽度布局：在网页设计时要注意，不能使用宽度及宽度的元素，字体也不能使用大小而只能使用相对大小，且图片实现自动百分比缩放这是非常重要的。网页会自动根据屏幕宽度来调整页面百分比。但是无论怎样缩放，他们主体的内容和布局是没有变化的。

在这种方法使用的过程中暴露出一个问题。当网站内容过多时，如果屏幕太小，即使网页能够根据屏幕大小进行适配，但在小屏幕上查看时，却会感觉内容过于拥挤，甚至无法看清，因此现在基本已不在使用这种适配方式了。

而另一种流式布局正是为了解决这一问题而衍生的，其成为了目前主流使用的布局方式。流式布局同样可以自动识别屏幕宽度，并做出相应网页调整，但其在布局和展示的内容上可能会有所变动。在网页设计时各个区块的位置都是浮动的，不是固定不变的，当屏幕宽度太小，放不下两个元素时，后面的元素会自动滚动到前面元素的下方进行排列，不会在水平方向溢出。这样在相对较小的屏幕上浏览时，就不会出现过于拥挤和看不清的现象了。

同样，这在使用流式布局时也需要小心定位的使用，加载不同分辨率的图片也需要注意图像可能会出现的失真现象。

相对于自适应给广大网页设计师们带来的便捷和效率，其也把因各类CSS文件加载速度稍慢且带来较大的流量耗费等问题带给了用户，或许以后会有更好的解决办法。

 

 

以上 【Web自适应是什么】的内容由欣创网络（ https://www.xcwl.com）收集整理，本文网址 ： https://www.xcwl.com/news/8newdt.html ，转载请注明出处，如有侵权，联系删除！

更多有关汉中网站建设，汉中网站设计、汉中网站制作、汉中做网站公司、微信公众平台开发、电商平台建设 等互联网应用服务都可以联系我们。网站建设热线： 0916-2233667/手机：18700660007（朱先生）