大家好，我是逆战班的一名学员，今天我来给大家分享一下关于网页宽高自适应。
网页宽高自适应第一眼看到的字面意思，就是网页的宽度与高度它可以去自己适应来调整网页中元素的高度与宽度。也就是说在不同分辨率的电脑下，在不同大小的网页窗口下，网页中的元素显示所占的百分比它始终是一样的，使得网页中元素的布局始终如一，不会使网页变小或分辨率不同而影响到网页的美观及布局。
那么在网页中如何实现宽高自适应呢，当让元素的高度相对浏览器窗口显示百分比的时候，那就需要用到css方法，第一步先要给html,body{height:100%;},全屏显示的页面必须要设置，因为百分比设置宽高的时候，都是相对当前元素最近的父元素显示的百分比的值（百分比这个值显示大小的参照物就是自己最近的父元素）。
当块状元素不去写宽度的时候，默认宽度就是100%，是父元素宽度的100%，也就是说它始终是和父元素同宽的。它在默认情况下，如果给块元素加了绝对或固定定位，它的宽度就不再是100%显示了。也不会跟父元素同宽，而是跟里面的内容同宽，如果元素里没有内容，没有定义宽高的时候，元素就会不见。
网页宽高自适应用于自适应网站建设，满足了各类根据窗口大小去调整做出改变，一定宽度范围内提供稳定的视觉体验，缺点在于对老旧的浏览器兼容性较差，对产品的设计能力要求较高，对页面调整时可能需要更改较多的尺寸下的布局，不过我相信，未来的自适应布局将会成为潮流！
来源：CSDN
作者：showkw
链接：https://blog.csdn.net/showkw/article/details/104906534