gpt4 book ai didi

html - iPhone 上的容器 DIV 不是 100% 宽度

转载 作者:行者123 更新时间:2023-11-28 08:58:27 24 4
gpt4 key购买 nike

看看http://benoitfal.com/tess.html在 iPhone 上,请注意我的容器 div 是错误的......它应该是浏览器的 100% 宽度。

最佳答案

假设你的 iPhone 和我的 375px 一样宽 - 这是 100%。您的图片宽度超过 375 像素,因此 iPhone 缩小以显示整个页面。容器仍然是 100%(在我的例子中是 375px),这就是为什么你的盒子只有屏幕的一半左右。如果您将图像宽度设置为 100% 而不是实际大小,它们将缩小以适合视口(viewport)。

桌面的原始解决方案:你的盒子是浏览器的 100% 宽度,但你已经在每一边添加了 6px 的填充。不幸的是,这会添加到宽度中,这就是它溢出的原因。在 div 上设置 box-sizing: border-box 它将修复它。

更多关于 box-sizing 的信息:https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing

因为这还不是完全被接受的 CSS,您应该按照链接中的示例使用浏览器前缀。如果您将 Compass 用于 SASS,则可以使用 @include box-sizing(border-box)

关于html - iPhone 上的容器 DIV 不是 100% 宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27031612/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com