Html It引导旁边的转盘指示器

在引导过程中，转盘指示器是否可能位于转盘旁边？我想在右边的一些指标有他们的字体，所以我知道哪个滑块我点击

图片说明我想要的：

---

你可以把控件放在任何你想放的地方，这些是使它们工作的标记

href=“#myCarousel”

指向旋转木马id，然后

数据幻灯片=“下一步”

设置行为：

<a class="right carousel-control" href="#myCarousel" role="button" data-slide="next">next</a>

<a class="right carousel-control" href="#myCarousel" role="button" data-slide="prev">prev</a>

---

类似的东西可能适合您：

HTML

   <div class="container">
      <div class="page-header">
        <h1>Bootstrap carousel with number indicator</h1>
      </div>
    </div>
    <div class="container">
      <div id="carousel-example-generic" class="carousel slide">
      <!-- Indicators --> 
      <ol class="carousel-indicators carousel-indicators-numbers">
        <li data-target="#carousel-example-generic" data-slide-to="0" class="active">Slide 1</li><br>
        <li data-target="#carousel-example-generic" data-slide-to="1">Slide 2</li><br>
      </ol>

      <!-- Wrapper for slides -->
      <div class="carousel-inner" role="listbox">
        <div class="item active">
          <img src="http://placehold.it/1200x500" alt="...">
        </div>
        <div class="item">
          <img src="http://placehold.it/1200x500" alt="...">
        </div>
      </div>

      <!-- Controls -->
      <a class="left carousel-control" href="#carousel-example-generic" role="button" data-slide="prev">
        <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
        <span class="sr-only">Previous</span>
      </a>
      <a class="right carousel-control" href="#carousel-example-generic" role="button" data-slide="next">
        <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
      </a>
    </div>
    </div>

.carousel-indicators-numbers {
    li {
      display: block;
      position: relative;
      left:140%;
      bottom: 150px;
      text-indent: 0;
      margin: 0 2px;
      width: 70px;
      height: 30px;
      border: none;
      line-height: 30px;
      color: #fff;
      background-color: #999;
      transition: all 0.25s ease;
      &.active, &:hover {
        margin: 0 2px;
        width: 70px;
        height: 30px;
        background-color: #337ab7;        
      }
    }
}