欢迎点击「算法与编程之美」↑关注我们!
本文首发于微信公众号:"算法与编程之美",欢迎关注,及时了解更多此系列文章。
关于如何解决网页制作中宽高自适应的问题
1 问题描述在假期里较系统的学习了html的静态网页制作,但在这过程中出现了一系列问题,比如:如何用盒子模型布局;如何用html和css实现轮播图的效果等;值得我们关注的是很多同学遇到了一个相同的问题,当我们的静态网页在其他PC端显示时,会出现排版混乱等情况,那么该如何解决宽高自适应的问题呢?在我经过几天的接触和学习之后,我对如何解决自适应问题有了初步的认识和经验,在此分享给大家,帮助大家快速了解和学习html。
2 问题分析一般而言,在我们设计网页的时候,经常会遇到自适应问题,实际这些工作完全可以交给浏览器来完成就可以了,只可惜,无论什么浏览器在自适应这个问题上都处理的不尽人意,在网上查询到的解决办法有很多,但有些解决办法并不是很适合我们这样的初学者,所以在解决一些技术上的问题的时候,我们需要选择适合自己的方式,除此之外,也要加强对基础知识的巩固,那么遇到问题的时候就可以迎难而解了。
3 解决方案自适应布局分两类:高度和宽度
1,高度自适应布局
高度自适应的原理就是把每个模块设置为绝对定位,再设置中间自适应的模块的top和bottom属性的