Как сделать небольшую полосу над частью слова с помощью псевдоэлемента?

Question

.SERVICES{
        font-size: 46px;
        line-height: bold;
        text-align: center;
        color:#7A7A7A;
        margin-top: 245px;
    }

Answer 1

Если я вас правильно понял, то вот так:

.service{
    font-size: 46px;
    line-height: bold;
    text-align: center;
    color:#7A7A7A;
    margin: 145px auto 0;
    position: relative;
    width: fit-content;
}

.service:before{
  content: "";
  display: inline-block;
  position: absolute;
  height: 10px;
  width: 50%;
  left: 0;
  background: repeating-linear-gradient(45deg, turquoise, turquoise 10px, #D7DFED 10px, #D7DFED 20px);
}

<div class="service">Hello</div>

БЛОГ НА HUSL

Как сделать небольшую полосу над частью слова с помощью псевдоэлемента?

Ответы (1 шт):