gpt4 book ai didi

html - 正文/HTML 元素缩小到比视口(viewport)小得多

转载 作者:太空宇宙 更新时间:2023-11-04 07:27:49 25 4
gpt4 key购买 nike

我正在使我的 wordpress 网站响应。我正在处理的页面上有两张图片,我想设置 max-width 100% 使他们响应(这是我在我制作的另一个网站上所做的并且效果很好)。但是,我注意到当我在 Chrome 开发工具中缩小页面时 <html><body>元素正在缩小到非常奇怪的大小,与视口(viewport)大小完全无关。下面分别是 和 元素的屏幕截图,分别悬停在 chrome 开发工具中:

html body

而且,当然自 max-width当我将图像设置为 <html> 时,带有百分比值的“定义包含 block 的最大宽度”和此处的包含 block ( bodymax-width: 100% )正在以这种不寻常的方式调整自身大小他们基于这些元素的奇怪大小。

我对这些元素的唯一 CSS 是:

* {
box-sizing: border-box;
}


body {
margin: 0;
}

所以我的问题是,<html> 到底在哪里?和 <body>元素的大小来自?

最佳答案

这种行为最早出现在几个版本之前的 Chrome 中;尝试使用 FF (Moz/Firefox) 响应式开发工具测试您的站点/屏幕——我猜您会看到预期的结果。但这不一定是 Chrome 的问题;就我而言,它与环境有关。这些天我主要使用 AEM,如果我在身份验证模式/禁用(或直接身份验证模式)下进行测试,则会出现此问题。但是,如果我在生产环境中实时查看同一页面 = 没问题。所以我的猜测(至少对我们而言)是它与 CMS 或服务器设置有关。这些天我倾向于使用 FF 响应式开发工具 - 试一试,让我们知道你的表现如何。

关于html - 正文/HTML 元素缩小到比视口(viewport)小得多,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49713274/

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