背景图像中的文本溢出

Question

您好，我希望我的背景图片能够包裹其中的 content/text。文本似乎从背景图像中溢出并与其他文本重叠。它在桌面上运行良好，但当我尝试在我的 iPhone 中打开 Codepen 时，它并没有像预期的那样。请参考我在这里附上的图片。

`https://codepen.io/sharonloh/full/pBrdRd`

我是编码新手，在尝试搜索解决方案后尝试了各种方法，但似乎没有任何效果。

Text overflowing from background image

Answer 1

从您发布的图片来看，有多种可能的分辨率。

第一个潜在的问题是您设置了背景图片但没有设置其他背景属性。

解决问题的一种方法是在 css 中添加 repeat：

 background-image: (your image);
 background-repeat: repeat;

将此添加到您的 css image/background class。如果只想让图像垂直重复，可以使用 repeat-y 而不是 repeat。 horizontal/repeat-x 类似。另一种方法是使用 background-size:cover。如果你只想让它在较小的屏幕上重复，你可以添加一个媒体查询并在那里添加额外的属性。

以后请添加您的 css/html（现在最好！您可以编辑您的问题以添加代码）。它有助于更清楚地说明如何解决问题。

希望对您有所帮助

背景图像中的文本溢出

Text overflow from Background Image

html

css

background-image

background-color