我在 html 主体部分添加了一个纹理背景图像，它重复了整个主体部分，但我希望这个纹理在浏览器中重复一半
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Background</title>
<style>
body{
background:url('bg.png');
}
</style>
</head>
<body>
</body>
</html>
最佳答案
只需在绝对定位的 body 上使用伪元素即可。
宽度为 50%，高度为 100%，超过 50%。
html,
body {
height: 100%;
margin: 0;
padding: 0;
}
body {
min-height: 100%;
position: relative;
}
body:before {
content: '';
position: absolute;
left: 50%;
height: 100%;
width: 50%;
background-image: url(http://lorempixel.com/image_output/abstract-q-c-25-25-1.jpg);
z-index: -1;
}
h1 {
text-align: center;
color: red;
margin: 0;
}<h1>My Heading</h1>关于html - 如何从浏览器中心添加纹理背景？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34289012/