html如何添加背景图片

作者：金钱打造势力狗。发布日期:2025-02-16 浏览:127

<!DOCTYPE html>
<html>
<head>
    <title>背景图片示例</title>
    <style>
        /* 使用 CSS 设置 body 的背景图片 */
        body {
            background-image: url('your-image-url.jpg'); /* 替换为你的图片 URL */
            background-size: cover; /* 使背景图片覆盖整个页面 */
            background-repeat: no-repeat; /* 防止背景图片重复 */
            background-position: center; /* 将背景图片居中显示 */
        }
    </style>
</head>
<body>
    <h1>这是一个带有背景图片的网页</h1>
</body>
</html>

解释说明：

background-image: url('your-image-url.jpg');：设置背景图片的路径。你需要将 'your-image-url.jpg' 替换为你实际的图片路径或 URL。
background-size: cover;：确保背景图片覆盖整个页面，不会留白。
background-repeat: no-repeat;：防止背景图片在水平和垂直方向上重复。
background-position: center;：将背景图片居中显示。

如果你不想使用 CSS 来设置背景图片，也可以直接在 HTML 标签中使用 style 属性，但推荐使用 CSS 进行样式管理。

上一篇：html 在线预览

下一篇：html 下拉列表