<p>问题的图片： 问题的图片</p> <p>如果你看一下之前的图片，你会发现我那里有一个巨大的空白空间。当我有我的正常显示（大约1200像素）时，一切都很好。然而，当宽度被缩小时，那个空白空间总是增加，我不知道为什么会这样。</p> <p>屏幕正常显示的图片： 正常显示的图片</p> <p>我将上传一部分HTML和CSS代码，以便清晰地写出代码。</p> <p><br /></p> <pre class="brush:css;toolbar:false;">.about-me{ margin-top: 10px; max-width: 100%; max-height: 100%; height: 100vh; } .about-me h1{ color: goldenrod; text-align: center; font-size: 52px; } .about-me .about{ display: flex; justify-content: center; align-items: center; } .about-me .about .text-container{ max-width: 70%; } .about-me .about .text-container p{ font-size: 24px; text-align: center; margin: 50px; } .about-me .about .text-container span{ color: goldenrod; font-weight: 900; } .border{ display: flex; justify-content: center; align-items: center; border: 1px solid goldenrod; background-color: goldenrod; border-radius: 50%; margin: 0 50px; max-width: 100%; } .about-me .border img{ max-width: 100%; max-height: 100%; border-radius: 50%; scale: 95%; box-shadow: 0 0 10px rgba(0, 0, 0, 0.2); }</pre> <pre class="brush:html;toolbar:false;">&lt;div class="about-me" id="about-me"&gt; &lt;h1&gt;我们是什么？&lt;/h1&gt; &lt;div class="about"&gt; &lt;div class="text-container"&gt; &lt;p&gt;文本&lt;/p&gt; &lt;p&gt;文本&lt;/p&gt; &lt;p&gt;文本&lt;/p&gt; &lt;/div&gt; &lt;div class="border"&gt; &lt;img src="img/arcos.jpg" alt=""&gt; &lt;/div&gt; &lt;/div&gt; &lt;/div&gt;</pre> <p><br /></p>