Webkit 将 <details> 个祖先重置为默认框模型
Webkit resets <details> ascendants to default box model
在我看来像是 Webkit 错误，但我不确定。尽管 <details> 元素已获得正确的 border-box 值，但 shadow DOM 以某种方式将所有元素重置为默认值 content-box。 Firefox 是一致的。 IE/Edge 还不支持 <details>。
这是错误还是预期行为？
这是一个错误，您可以在此处阅读相关信息：
因此您需要恢复到 旧 方式来预设 box-sizing
*, *::before, *::after { box-sizing: border-box; }
或将其显式设置为 details
比切换到以每个元素为目标的旧方法更好的解决方案是仅以细节的子元素为目标。这仍然允许您定位重置组件，但细节除外，这些组件无论如何都不起作用。这可以通过以下方式完成：
details > * { box-sizing: border-box; }
在我看来像是 Webkit 错误，但我不确定。尽管 <details> 元素已获得正确的 border-box 值，但 shadow DOM 以某种方式将所有元素重置为默认值 content-box。 Firefox 是一致的。 IE/Edge 还不支持 <details>。
这是错误还是预期行为？
这是一个错误，您可以在此处阅读相关信息：
因此您需要恢复到 旧 方式来预设 box-sizing
*, *::before, *::after { box-sizing: border-box; }
或将其显式设置为 details
比切换到以每个元素为目标的旧方法更好的解决方案是仅以细节的子元素为目标。这仍然允许您定位重置组件，但细节除外，这些组件无论如何都不起作用。这可以通过以下方式完成：
details > * { box-sizing: border-box; }