我对HTML非常陌生，我正在尝试重新创建一个wix模板进行练习，我试图将一段文本对齐到中心，并添加了一个背景，背景向左和向右扩展。有办法阻止这种情况吗？
body {
background-image: url(../images/Mountain-Landscapes-14.jpg);
}
h3.top {
font-family: 'Gill Sans', 'Gill Sans MT', 'Calibri', 'Trebuchet MS', sans-serif;
font-weight: bolder;
letter-spacing: 5px;
padding-top: 35px;
}
h1 {
font-family: 'Gill Sans', 'Gill Sans MT', 'Calibri', 'Trebuchet MS', sans-serif;
font-weight: bolder;
letter-spacing: 13px;
text-align: center;
font-size: 164px;
padding-top: 0px;
margin-top: 0px;
margin-bottom: 0px;
}
h3.bottom {
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
font-weight: 150;
text-align: center;
color: black;
margin-top: 0px;
letter-spacing: 3.5px;
}
p {
color: white;
text-align: center;
background: black;
}<div class="top">
<h3 class="top" align='center'>AMBITION IS THE FIRST STEP TOWARDS</h3>
<h1>SUCCESS</h1>
<h3 class="bottom">Now Avaliable for Online Coaching</h3>
<p>Book Now</p>
</div>我不太明白你是想让文本居中对齐，还是只是停止它向左和向右扩展
但像这样。。。。这里还有代码笔演示，可以更好地查看代码笔
body{
background-image: url(../images/Mountain-Landscapes-14.jpg);
}
h3.top{
font-family: 'Gill Sans', 'Gill Sans MT', 'Calibri', 'Trebuchet MS', sans-serif;
font-weight: bolder;
letter-spacing: 5px;
padding-top: 35px;
}
h1{
font-family: 'Gill Sans', 'Gill Sans MT', 'Calibri', 'Trebuchet MS', sans-serif;
font-weight: bolder;
letter-spacing: 13px;
text-align: center;
font-size: 164px;
padding-top: 0px;
margin-top: 0px;
margin-bottom: 0px;
}
h3.bottom{
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
font-weight: 150;
text-align: center;
color: black;
margin-top: 0px;
letter-spacing: 3.5px;
}
p{
color: white;
background: black;
margin: auto 0 auto 0;
/* top,right,bottom,left */
width: 8%;
display: block;
}<div class="top">
<h3 class="top" align='center'>AMBITION IS THE FIRST STEP TOWARDS</h3>
<h1>SUCCESS</h1>
<h3 class="bottom">Now Avaliable for Online Coaching</h3>
<p>Book Now</p>
</div>不能真正说出您在这里使用的图像的尺寸，但您可以使用background-size设置它，将它设置为100% 100%，以使图像的尺寸适合您正在使用的容器。然后添加background-repeat: no-repeat;以防止图像重复。请参阅下面的片段以供参考。
body {
background-image: url(https://cdn.pixabay.com/photo/2018/02/12/08/33/abstract-3147697_960_720.jpg);
background-size: 100% 100%;
background-repeat: no-repeat;
}
h3.top {
font-family: 'Gill Sans', 'Gill Sans MT', 'Calibri', 'Trebuchet MS', sans-serif;
font-weight: bolder;
letter-spacing: 5px;
padding-top: 35px;
}
h1 {
font-family: 'Gill Sans', 'Gill Sans MT', 'Calibri', 'Trebuchet MS', sans-serif;
font-weight: bolder;
letter-spacing: 13px;
text-align: center;
font-size: 164px;
padding-top: 0px;
margin-top: 0px;
margin-bottom: 0px;
}
h3.bottom {
font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
font-weight: 150;
text-align: center;
color: black;
margin-top: 0px;
letter-spacing: 3.5px;
}
p {
color: white;
enter code here text-align: center;
background: black;
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="style.css">
<title>Document</title>
</head>
<body>
<div class="top">
<h3 class="top" align='center'>AMBITION IS THE FIRST STEP TOWARDS</h3>
<h1>SUCCESS</h1>
<h3 class="bottom">Now Avaliable for Online Coaching</h3>
<p>Book Now</p>
</div>
</body>
</html>点击此处了解有关background-image的更多信息。