我想知道:如何突出显示文本并更改突出显示的高度?
这是我得到的:



.highlight {
  display: inline-block;
  height: 10px;
  background: -webkit-linear-gradient(110deg, #005fed, #00bbff);
}

<h1>Hello <span class="highlight">World</span></h1>





现在,对于大字体,我希望“突出显示”的高度小于文本的高度,并且此代码可以正常工作,但是我无法将其定位在文本的中心。结果如下:
click here to see

现在,我怎样才能将背景居中到线条的高度?

我想使用行高的百分比,因此它也可以响应更快,但是使用百分比则行不通。谢谢

最佳答案

您需要为此更改样式:



.highlight{
    position: absolute;
    height: 50px;
    line-height: 50px;
    text-align: center;
    background: -webkit-linear-gradient(110deg, #005fed, #00bbff);
}

<h1>Hello <span class="highlight">World</span></h1>

关于html - 如何突出显示文本并更改CSS中的高度和位置?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/59379177/

10-09 06:44
查看更多