首先，如果h2元素不需要完全占据整行，可以考虑将display属性设置为inline-block，这样元素会根据内容自动调整宽度，背景色也不会充满整行。但是有时可能要求必须使用display: block，那怎么办呢？
方法一：使用width: max-content;
h2 {
font-size: 22px;
font-weight: bold;
background-color: #ffff99; /* 淡黄色 */
/*border: 1px solid #ffd700;*/
/* display: inline-block; 将 h2 标签设置 */
display: block;
width: max-content;/*避免背景色充满整行*/
padding: 5px 5px 5px 5px; /* 可根据上右下左的顺序调整内边距，以控制文本与边框的距离 */
margin-bottom: 15px; /* 设置 h2 底部外边距 */
}方法二：设置内联元素包裹文字并设置背景色
在h2标签内使用一个内联元素（如span）来包裹文本内容，并将背景色设置在这个内联元素上，而不是h2元素本身。这样背景色就只会应用于文本所在的区域，而不会占据整行。
<h2><span style="background-color: lightblue;">这是一个h2标题</span></h2>
