引导-3外

我有一个自举-3转盘用3×表示的DIV每次。你可以点击右键和左键来显示下3个DIV。但我的指标是一个可以点击的整个区域，即灰色块。是否有可能点击？另外，如何让东西远离我的DIV，现在它与我的内容重叠？格拉西亚斯！

HTML：

<div class="carousel slide" data-ride="carousel" id= 
"carousel-example- generic"> 
    <!-- Indicators --> 
    <ol class="carousel-indicators"> 
     <li class="active" data-slide-to="0" data-target= 
     "#carousel-example-generic"></li> 

     <li data-slide-to="1" data-target="#carousel-example-generic"></li> 

     <li data-slide-to="2" data-target="#carousel-example-generic"></li> 
    </ol><!-- Slider Content (Wrapper for slides)--> 

    <div class="carousel-inner"> 
     <div class="item active"> 
      <div class="col-md-4 col-sm-6"> 
       <p> 
      aaaaaaaaaaaaaaaaaaaa</p> 
      </div> 

      <div class="col-md-4 col-sm-6 hidden-xs"> 
       <p>bbbbbbbbbbbbbb</p> 
      </div> 

      <div class="col-md-4 col-sm-6 hidden-sm hidden-xs"> 
       <p>cccccccccccccc</p> 
      </div> 
     </div> 

     <div class="item"> 
      <div class="col-md-4 col-sm-6"> 
       <p>dddddddddddddd</p> 
      </div> 

      <div class="col-md-4 col-sm-6 hidden-xs"> 
       <p>eeeeeeeeeeeeee</p> 
      </div> 

      <div class="col-md-4 col-sm-6 hidden-sm hidden-xs"> 
       <p>ffffffffffffff</p> 
      </div> 
     </div> 
    </div> 
</div><!-- Controls --> 
<a class="left carousel-control" data-slide="prev" href= 
"#carousel-example-generic"><span class= 
"glyphicon glyphicon-chevron-left"></span></a> <a class= 
"right carousel-control" data-slide="next" href= 
"#carousel-example-generic"><span class= 
"glyphicon glyphicon-chevron-right"></span></a>

CSS：

.carousel-indicators li { visibility: hidden; } 

.carousel-inner .item { 
font-size:10px; 
color:#0404B4 
} 

.carousel-control { 
z-index: 10; 
top: 2%; 
font-family: 'Helvetica Neue', Arial, sans-serif; 
}

来源

2015-04-06 raulbaros

请尽量表现出[微创完整的示例]（http://stackoverflow.com/help/mcve），而不是在未来的链接。谢谢。 – icedwater 2015-04-06 01:34:32

@icedwater - 我在这里直接在我已经提供的Bootply链接旁边添加了我的代码。现在好吗？谢谢。 – raulbaros 2015-04-06 11:30:23

I'have更新你的CSS。

/* CSS used here will be applied after bootstrap.css */ 
.carousel-indicators li { visibility: hidden; } 

.carousel-inner .item { 
    font-size:10px; 
    color:#0404B4 
    } 

.carousel-control { 
    z-index: 10; 
    top: 2%; 
    width: 30px; // no more gray thing 
    font-family: 'Helvetica Neue', Arial, sans-serif; 
} 
.carousel-control.left, 
.carousel-control.right { background: none } 
// change it according to your needs 
.carousel-control.left { left: -10px; } 
.carousel-control.right { right: -10px; }

Demo

来源

2015-04-06 11:39:15 agriboz

回答

相关问题