浅谈Web自适应\"

浅谈Web自适应\"

• 来源:网络
• 更新日期:2020-04-23

摘要：简单事情简单做-宽度自适应所谓宽度自适应严格来说是一种PC端的自适应布局方式在移动端的延伸，在定义容器的时候，采用百分数来设置宽度。该宽度自适应在新的时代有了新的方法，

简单事情简单做-宽度自适应

所谓宽度自适应严格来说是一种PC端的自适应布局方式在移动端的延伸，在定义容器的时候，采用百分数来设置宽度。

该宽度自适应在新的时代有了新的方法，随着弹性布局的普及，它经常被flex或者box这样的伸缩性布局方式替代，变得越来越“弹性”十足。

大小之辨-rem

REM属性指的是相对于根元素设置某个元素的字体大小。它同时也可以用作为设置高度等一系列可以用px来标注的单位。

让元素飞起来-媒体查询

运用css新属性media query 特性也可以实现我们上说到过的布局样式。为尺寸设置根元素字体大小。

总结

不管哪一种自适应方式，我们的目的是使得开发网页在各种屏幕下变得好看：如果你的项目定位的用户群仅仅是使用某种机型的人，那么可以采用第一种自适应方式。如果你的客户主要是移动端，但是客户的设备类型庞杂，建议采用第二种方式。如果你雄心勃勃地需要建立一套兼容PC、PAD、mobile多端的一体化web应用，那么第三种选择显然是最适合你的。每种方式都有自己的利弊，根据需求权衡利害，合理地实现自适应布局，需要不停的实践和摸索。路漫漫其修远兮，吾将上下而求索。