如何在CSS中限制屏幕大小的最大宽度和高度？

2023-03-20 15:12| 来源: 网络整理| 查看: 265

我正在尝试创建一个php库,这就是为什么我需要一个好的Mask,以后可以显示图片.我希望Mask不要大于屏幕大小.我的意思是,必须没有滚动,整体需要只有浏览器窗口的宽度和高度,这样每个子对象都限制在浏览器的帧大小,如果溢出则会缩小.我试着max-width和max-height上,但它不工作.

这是我的代码:

index.html的:

Home next picture previous picture

Our Galery

style.css中:

body { max-width: 100%; max-height: 100%; } /* mother-container */ div#mother { max-width: 100%; max-height: 100%; margin: auto; } /* main-container */ #container-bild { max-width: 100%; max-height: 100%; } /* picture in main-container */ #img-bild { max-width: 100%; max-height: 100%; border: 1px solid #280198; }

这仍然是什么样的 - 我不希望页面比窗口更大 - 点击这里查看错误的版本!

1> kzhao14..：

如果您希望高度恰好是视图屏幕的100%,并且宽度相同,请使用

height: 100vh;//100% view height width: 100vw;// 100% view width

div { background-color: blue; height: 100vh; width: 100vw; position: absolute; top: 0; left: 0; color: white; } some content here

【本文地址】

公司简介

联系我们