html - 单独段落行的背景颜色 - Css

Question

我正在尝试在标题行上添加背景颜色，但我不能让它完美，因为我的客户需要我做。我的客户需要这个完全相同： 在响应模式下它应该看起来像： 我所做的是我添加到文本中，但它并不完美。 背景颜色从顶部和底部蔓延，尝试了很多但无法弄清楚。这是我的代码：


background-color

.sectionTitle {
    font-size: 58px;
    font-size: 3.0526315789rem;
    line-height: 56px;
    line-height: .9655172414;
    font-weight: bold;
    color: #233e57;
    text-align: center;
}
.sectionTitle span {
    background-color: #ffe2b3;
    display: inline;
}

<h1 class="sectionTitle"><span>What students are Saying?</span></h1>

请帮我解决这个问题。

标签： htmlcss

Answer 1

希望这对您有所帮助。

.sectionTitle {
  font-size: 58px;
  font-size: 3.0526315789rem;
  line-height: 56px;
  line-height: .9655172414;
  font-weight: bold;
  color: #233e57;
  text-align: center;
}

.sectionTitle span {
  display: inline;
  line-height: 0.2;
  padding: 0;
  background: url('https://i.ibb.co/QFNPT8G/bg.png');
  background-repeat: repeat;
  background-position-x: 0%;
  background-position-y: 0%;
  background-repeat: repeat-x;
  background-size: 30px 40px;
  background-position: center center;
}

<h1 class="sectionTitle"><span>What students are Saying?</span></h1>