如何约束div中的文本和元素

Question

我正在使用CSS＆amp ;;创建一个网页HTML

一切看起来都很好，直到我放大。一旦我放大字母开始流出div。

我该如何解决这个问题？

Answer 1

您的问题与响应式网页设计有关。默认情况下，人们为自己的屏幕创建网站。但并非所有人都拥有与您相同的屏幕分辨率或视口等。

解决方案：

媒体查询：

使用媒体查询，当用户具有不同的分辨率/视口或正在调整屏幕大小时，您可以更改css代码。

@media (max-width: 979px) {
    .h2 {
        font-size: 10px;
    }
}

当用户的屏幕宽度小于979px时，这会将h2标签的字体更改为10px。我将为您提供w3Schools页面的链接，以便您了解@media规则具有哪些属性。

Media queries w3cschools

提示： 您可以通过打开Chrome开发人员工具并调整浏览器大小来查看解决方案。（左上角）

如果您将来有任何问题，请告诉我，我会解释一些有关媒体查询的内容。