垂直对齐 Bootstrap 轮播标题
要将轮播标题垂直居中并将其稍微向左放置,您可以使用 CSS 属性的 CSS 变换翻译Y函数。
HTML:
<code class="html"><!-- start JumboCarousel --> <div id="jumboCarousel" class="carousel slide" data-ride="carousel"> <!-- Indicators --> <ol class="carousel-indicators hidden-xs"> <li data-target="#jumboCarousel" data-slide-to="0" class="active"></li> <li data-target="#jumboCarousel" data-slide-to="1"></li> <li data-target="#jumboCarousel" data-slide-to="2"></li> <li data-target="#jumboCarousel" data-slide-to="3"></li> </ol><!-- end carousel-indicators --> <!-- Wrapper for Slides --> <div class="carousel-inner" role="listbox"> <div class="item active" id="slide1"> <a href="#"><img src="http://placehold.it/1920x720&text=Slide+1" alt="Slide 1"></a> <div class="carousel-caption"> <h1>Check Out this Moose</h1> <p class="lead">This text is super engaging and makes you want to click the button.</p> <a href="#" class="btn btn-lg btn-primary">Learn More</a> </div><!-- end carousel-caption --> </div><!-- end slide1 --> <div class="item" id="slide2"> <img src="http://placehold.it/1920x720&text=Slide+2" alt="Slide 2"> <div class="carousel-caption"></code>
以上是如何将 Bootstrap 轮播标题垂直居中并将其稍微向左放置?的详细内容。更多信息请关注PHP中文网其他相关文章!