html - 使用 img 作为

Question

目前我正在使用 CSS(对它来说真的很陌生)，我想为标题设置一个背景 img - 设法让它工作 - 然而，努力使 img 宽度调整到标题的长度(内容)

h2{
 font-family: Arial, Helvetica, sans-serif; 
 font-size: 20px; 
 padding-left: 20px; 
 padding-top: 10px;
 margin-top:10px;
 color:white;
 }
span h2{
 background-image: url(border.gif);
 background-repeat: no-repeat;
 background-position: bottom left;
 background-size: 100% 100%;
 }

如您所见，我尝试将 等内联元素包含在内，也尝试将其制作为内联元素，但无法使其正常工作。

任何帮助都会非常感谢

Answer 1

Span 是行内元素， block 标题不应该在里面。

如果要将背景设置为h2，请将其设置为h2。

h2 {
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 20px; 
    padding-left: 20px; 
    padding-top: 10px;
    margin-top:10px;
    color:white;
    background: url('border.gif') left bottom / 100% 100% no-repeat;
}

在 HTML 中只有 h2，周围没有 span。