时间戳

首页 > 解决方案 > 背景图片在H1之上

html - 背景图片在H1之上

问题描述

h1 位于背景图像的后面。我试过使用 z-index 和 position:absolute 和 relative 但没有任何改变。如何使背景图像永远保持背景，而不必在其上添加所有其他元素？

body {
background-image: url("https://wallpaperaccess.com/full/396538.jpg");
background-repeat: no-repeat;
background-size: cover;
}

  
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" href="index.css">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Hotoi Sebastian | Front-End Developer & Web Designer</title>
</head>
<body>
    <div class="text">
        <h1>Sebastian Hotoi</h1>
    </div>
</body>
</html>

标签： htmlcssbackground

解决方案

我会避免使身体位置绝对。

如果你想要标题后面的背景应该是默认的，而不是绝对我们使用任何 z-index。确保它不是图像与文本颜色相同的情况，只是让它看起来不存在:)

推荐阅读