Horizontal Lines Before And After Texts Inside Slides

Want to add horzontal line inside slides. we want inside lines in the sliders guys i am new to design these can you guys help with the code kindly answer this.

<div class="slideshow-container">

  <div class="mySlides fade">
    <div class="numbertext">1 / 3</div>
    <img src="banner.jpg" style="width:100%">
    <div class="text">Caption Text</div>
  </div>

  <div class="mySlides fade">
    <div class="numbertext">2 / 3</div>
    <img src="banner.jpg" style="width:100%">
    <div class="text">Caption Two</div>
  </div>

  <div class="mySlides fade">
    <div class="numbertext">3 / 3</div>
    <img src="banner.jpg" style="width:100%">
    <div class="text">Caption Three</div>
  </div>

  <a class="prev" onclick="plusSlides(-1)">&#10094;</a>
  <a class="next" onclick="plusSlides(1)">&#10095;</a>

</div>
<br>

<div class="center">
  <span class="slide" onclick="currentSlide(1)"> 01.</span>
  <span class="slide" onclick="currentSlide(2)">02.</span>
  <span class="slide" onclick="currentSlide(3)">03.</span>
</div>

you can try something like this:

.slide:not(:last-child)::after {
    margin: 4px 5px;
    content: '';
    width: 50px;
    height: 1px;
    background-color: black;
    display: inline-block;
}

but also you can create additional spans between.