スパンタグの透明度を変更すると、黒いバーが表示されるのはなぜですか？

Question

スパンタグに2つの背景を付けて、それを透明にするためにrgbaを使いましたが、私がそれを変更すると、コンテンツに横の黒い帯/バーが現れます。誰かがなぜ、またはそれを修正する方法を説明することができますか？

ありがとうございます。

h1 span { 
 
    color: white; 
 
    background-color: black; 
 
    background: rgba(0,0,0,0.7); 
 
    letter-spacing: 1px; 
 
    padding: 5px; 
 
}

<div class="image"> 
 
    <img src="images/castle.jpeg" alt="Wide musuem"/> 
 
    <h1><span>Beautiful Museums<span></h1> 
 
</div>

Answer 1

あなたはあなたがあなたのコードのタイプミスを持っているあなたのspanタグ

</span> 

Answer 2

を閉じるのを忘れていました。 2つの未開封<span>があります。それを閉じます：

h1 span { 
 
    color: white; 
 
    background-color: black; 
 
    background: rgba(0,0,0,0.7); 
 
    letter-spacing: 1px; 
 
    padding: 5px; 
 
}

<div class="image"> 
 
    <img src="images/castle.jpeg" alt="Wide musuem"/> 
 
    <h1><span>Beautiful Museums</span></h1> 
 
</div>

Answer 3

あなたはspanタグを閉じる必要があります。代わりに

<span>Beautiful Museums<span> 

のウルのコードがどこにあるの

<span>Beautiful Museums</span>