前端自适应布局的特点是分别为不同的屏幕分辨率定义布局,即创建多个静态布局,每个静态布局对应一个屏幕分辨率范围。改变屏幕分辨率可以切换不同的静态局部,但在每个静态布局中,页面元素不随窗口大小的调整发生变化。可以把前端自适应布局看作是静态布局的一个系列,网页通过媒体查询的方法自动选择相对应的CSS样式。
1.自适应布局特点前端自适应布局,屏幕分辨率变化时,页面里面元素的位置会变化而大小不会变化。根据不同的屏幕分辨率切换不同的布局样式,使整个网页看起来与使用的设备完美匹配。
2.自适应布局设计方法建企业网站使用 @media 媒体查询给不同尺寸和介质的设备切换不同的样式。在优秀的响应范围设计下可以给适配范围内的设备最好的体验,在同一个设备下实际还是固定的布局。缺点:(1)媒体查询是有限的,也就是可以枚举出来的,只能适应主流的宽高。(2)要匹配足够多的屏幕大小,工作量不小,设计也需要多个版本。3.自适应布局的缺点优点很完美,前端自适应布局缺点也很明显。建网站公司一般会根据不同的主流屏幕做多个媒体查询,这样往往会增加CSS样式的书写复杂程度,同时,一旦网页布局发生改动后期维护工作量相当之大。