我正在练习选择器和装饰，我将标题设置为居中，我希望它有某种颜色的背景，并且与文本大小相同，不占据整个屏幕，但是当我应用它在左侧显示的宽度，我不知道如何修复它
<!DOCTYPE html>
<html>
<head>
<title></title>
<style>
body {
background-color: #302e2f;
}
p { /*aplica el estilo a todos los 'p' */
text-align: center;
color: rgb(245, 211, 16);
}
p span {
display: block;
}
.titulo {
text-align: center;
color: #f540ec;
font-size: 30px;
padding: 30px;
background-color: lightblue;
width: fit-content;
}
h1, h2, h3 {
padding: 3px;
text-align: center;
color: rgba(21, 253, 0, 0.3);
font-family: verdana;
}
</style>
</head>
<body>
<div class="titulo">Intro de Elden Ring</div>
<p>
<span>La hojarasca nos cuenta una historia.</span>
<span>El Gran Círculo de Elden ha sido destruido.</span>
<span>En nuestro hogar, al otro lado de la niebla, las Tierras Intermedias.</span>
</p>
<h1>XD</h1>
<h2>XD</h2>
<h3>XD</h3>
</body>
</html>
在标题类中添加“margin: 0 auto”
.titulo {
text-align: center;
color: #f540ec;
font-size: 30px;
padding: 30px;
background-color: lightblue;
width: fit-content;
margin: 0 auto;
}