css中heigh、min-height和max-height的使用

1、min-height和height同时使用，谁大听谁的

2、max-height和height同时使用，虽小听谁的

3、height、min-heigth和max-height同时使用，分为以下情况

height > max-height > min-height   元素高度：max-height

height > min-height > max-height   元素高度：min-height

min-height > height > max-height   元素高度：min-height

min-height > max-height > height   元素高度：min-height

max-height > height > min-height   元素高度：height

max-height > min-height > height   元素高度：min-height

之前遇到一个使用场景：页面整体绝对定位且有背景颜色时，由于脱离文档流，使得父盒子高度为0，如果设置具体固定高度，在移动端上会出现适配问题，即不同尺寸手机高度不同，背景颜色出现断层，如果同时使用min-height和height，谁大听谁的，min-height：100%，height：固定高度（可以设置为刚好将定位元素包裹住的高度），当手机高度较大时，min-height > height，页面完整一屏，在小屏手机上，height > min-height，一屏放不下，页面滚动，出现滚动条，高度为height

CSS

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。