共计 531 个字符，预计需要花费 2 分钟才能阅读完成。
自适应布局
原文链接：https://note.noxussj.top/?source=zhihu
什么是自适应布局？
在不同屏幕分辨率下，可能以最佳的形式进行展现，元素的宽度尺寸可能会扭转，然而原有的展现形式不会扭转。通常应用 % 单位来实现自适应布局。
长处
页面可能兼容不同分辨率的屏幕。
毛病
因为开发的时候须要思考多种分辨率下的状况，会额定减少一些工作量。其次是当分辨率过于小时，可能会产生内容的拥挤。不会依据不同分辨率采纳不同的展现形式。
场景
次要兼容不同分辨率设施
根底案例
以下简略模仿一个自适应元素，在不同设施 / 分辨率下展现的成果。
容器尺寸 640px * 320px
元素的宽度是自适应的，依据父级容器宽度决定。
容器尺寸 150px * 320px
当分辨率改为 150px * 320px 时，也可能失常的展现成果。
容器尺寸 150px * 320px
像这种元素多并且容器的尺寸也过于小时，就会导致内容拥挤。
最全面的前端笔记来啦，蕴含了入门到入行的笔记，还反对实时成果预览。小伙伴们不须要再花工夫去写笔记，或者是去网上找笔记了。面试高频发问和你想要的笔记都帮你写好了。反对挪动端和 PC 端浏览，深色和浅色模式。
原文链接：https://note.noxussj.top/?source=zhihu
正文完