Html 图像字幕问题

h2跨度间隔棒{
填充：0 5px；
}
h2 span{
颜色：白色；
字体：粗体24px/45px Helvetica，无衬线；
字母间距：-1px；
背景：rgb（0,0,0）；/*回退颜色*/
背景：rgba（0,0,0,0.7）；
填充：10px；
}
h2{
位置：绝对位置；
顶部：50px；
左：0；
}

这是第一行。
这是第二行。

像这样吗

h2跨度间隔棒{
填充：0 5px；
}
h2 span{
颜色：白色；
字体：粗体24px/45px Helvetica，无衬线；
字母间距：-1px；
背景：rgb（0,0,0）；/*回退颜色*/
背景：rgba（0,0,0,0.7）；
填充：10px；
显示：内联块；
}
h2{
位置：绝对位置；
顶部：50px；
左：0；
}

---

这是第一行。
这是第二行。

更新：删除两个跨距之间的行

这个，对吗？不知道发生了什么，当我发布这篇文章时，它只显示了普通的HTML:/希望你能正确地看到它

h2 span{
颜色：白色；
字体：粗体24px/45px Helvetica，无衬线；
字母间距：-1px；
背景：rgb（0,0,0）；/*回退颜色*/
背景：rgba（0,0,0,0.7）；
填充：9px 10px；
}
h2{
位置：绝对位置；
顶部：50px；
左：0；
}

这是第一行。
这是第二行。

试试这个

h2跨度间隔棒{
}
h2 span{
颜色：白色；
字体：粗体24px/45px Helvetica，无衬线；
字母间距：-1px；
背景：rgb（0,0,0）；/*回退颜色*/
背景：rgba（0,0,0,0.7）；
填充：10px；
}
h2{
位置：绝对位置；
顶部：80px；
左：0；
}

---

这是第一行。
这是第二行。

是的，我在这里看到它很好-谢谢。它更好，但只是希望文本彼此对齐。然而，它已经摆脱了我所经历的障碍。看起来很棒，只是想知道我如何摆脱那条线。这是两个元素之间的重叠。谢谢你的帮助。很抱歉耽搁了。我刚刚调整了顶部和底部衬垫。请参阅新的更新。