HTML CSS：如何将背景图片铺满整个屏幕的宽度和高度

在本文中，我们将介绍如何使用HTML和CSS将背景图片拉伸至屏幕的100%宽度和高度。

阅读更多：HTML 教程

要实现将背景图片拉伸至屏幕的100%宽度和高度，我们可以使用CSS的background-size属性。background-size属性允许我们指定背景图片的大小。

我们可以为background-size属性设置两个值：宽度和高度。要使背景图片拉伸至屏幕的100%宽度和高度，我们可以将这两个值都设置为100%。

下面是一个示例CSS代码：

在上面的示例代码中，我们给body元素应用了一个背景图片，并设置了背景图片的重复方式为不重复。使用background-size属性，我们将背景图片的宽度和高度都设置为100%。

除了将背景图片的宽度和高度都设置为100%之外，我们还可以使用其他的background-size属性值来进一步控制背景图片的拉伸方式。

下面是一个完整的HTML代码示例，展示如何将背景图片拉伸至屏幕的100%宽度和高度：

This is a sample text.

在上面的示例代码中，我们将背景图片的路径替换为实际图片的路径，并将其保存为一个HTML文件。打开这个HTML文件，你将看到背景图片被拉伸至整个屏幕的宽度和高度，并显示了一个标题和一段文本。

通过使用CSS的background-size属性，我们可以轻松地将背景图片拉伸至屏幕的100%宽度和高度。我们可以使用”100% 100%”、cover或contain等值来控制背景图片的拉伸方式。通过合理使用这些方法，我们可以实现灵活且美观的全屏背景图片效果。