Slider

Slider básico

Para construir um slider, primeirio precisa criar um objeto com as classes row slider. Dentro deste objeto, crie os slides adicionando outro objeto com classe slide. Neste objeto, defina a background adicionando uma classe com cor ou uma imagem com a propriedade style inline. Se houver conteúdo além da imagem no slider, acrescente-os em um objeto com classe slide-body. Neste objeto você também deve orientar o alinhamento do conteúdo.

Slide 1

Center aligned
Example

Slide 2 - Left aligned

Slide 3 - Right aligned

<div class="row slider">
  <div class="slide" style="background:url('images/banner_japu.png');">
    <div class="slide-body center-align">
      <h4>Slide 1</h4>
      <h6>Center aligned</h6>
      <a href='' class='btn center'>Example</a>
    </div>
  </div>
  <div class="slide fundo-azul">
    <div class="slide-body left-align">
      <h4>Slide 2 - Left aligned</h4>
    </div>
  </div>
  <div class="slide fundo-vermelho">
    <div class="slide-body right-align">
      <h4>Slide 3 - Right aligned</h4>
    </div>
  </div>
</div>