- Termino del ejercicio Home
<div class="container">
<section id="mislide" class="carousel slide">
<ol class="carousel-indicators">
<li data-target="#mislide" data-slide-to="0" class="active"></li>
<li data-target="#mislide" data-slide-to="1"></li>
<li data-target="#mislide" data-slide-to="2"></li>
</ol>
<div class="carousel-inner">
<div class="item active">
<img src="img/silverado.jpg" class="adaptar">
</div>
<div class="item">
<img src="img/f150.jpg" class="adaptar">
</div>
<div class="item">
<img src="img/tundra.jpg" class="adaptar">
</div>
</div>
<a href="#mislide" class="left carousel-control" data-slide="prev">
<spam class="glyphicon glyphicon-chevron-left"></spam>
</a>
<a href="#mislide" class="right carousel-control" data-slide="next">
<spam class="glyphicon glyphicon-chevron-right"></spam>
</a>
</section><br>
<section>
<div class="row">
<div class="col-xs12 col-sm-12 col-md-4 col-lg-4">
<div class="row">
<div class="hidden-xs col-sm-3 col-md-6 col-lg-6">
<br><br><img src="img/interior.jpg" class="img-responsive">
</div>
<div class="col-xs-12 col-sm-9 col-md-6 col-lg-6">
<h3>Interior</h3><hr>
<p align="justify">Lorem Ipsum es simplemente el texto de relleno de las imprentas y archivos de texto. Lorem Ipsum ha sido el texto de relleno estándar de las industrias desde el año 1500, cuando un impresor (N. del T. persona que se dedica a la imprenta)<br><a href="#">leer más</a></p></div>
</div>
</div>
<div class="col-xs12 col-sm-12 col-md-4 col-lg-4">
<div class="row">
<div class="hidden-xs col-sm-3 col-md-6 col-lg-6">
<br><br><img src="img/motor.jpg" class="img-responsive">
</div>
<div class="col-xs-12 col-sm-9 col-md-6 col-lg-6">
<h3>Motor</h3><hr>
<p align="justify">Lorem Ipsum es simplemente el texto de relleno de las imprentas y archivos de texto. Lorem Ipsum ha sido el texto de relleno estándar de las industrias desde el año 1500, cuando un impresor (N. del T. persona que se dedica a la imprenta)<br><a href="#">leer más</a></p></div>
</div>
</div>
<div class="col-xs12 col-sm-12 col-md-4 col-lg-4">
<div class="row">
<div class="hidden-xs col-sm-3 col-md-6 col-lg-6">
<br><br><img src="img/exterior.jpg" class="img-responsive">
</div>
<div class="col-xs-12 col-sm-9 col-md-6 col-lg-6">
<h3>Exterior</h3><hr>
<p align="justify">Lorem Ipsum es simplemente el texto de relleno de las imprentas y archivos de texto. Lorem Ipsum ha sido el texto de relleno estándar de las industrias desde el año 1500, cuando un impresor (N. del T. persona que se dedica a la imprenta)<br><a href="#">leer más</a></p></div>
</div>
</div>
</div>
</section>
</div>
<section class="color1">
<div class="container">
<div class="row">
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6"><br><br><br>
<video controls class="img-responsive">
<source src="video/silverado.mp4" type="video/mp4"></source>
</video>
</div>
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6">
<h3>Silverado 2017</h3><hr>
<p>Lorem Ipsum es simplemente el texto de relleno de las imprentas y archivos de texto. Lorem Ipsum ha sido el texto de relleno estándar de las industrias desde el año 1500, cuando un impresor (N. del T. persona que se dedica a la imprenta)</p>
<ul>
<li><a href="#">Tema 1</a></li>
<li><a href="#">Tema 2</a></li>
<li><a href="#">Tema 3</a></li>
<li><a href="#">Tema 4</a></li>
</ul>
</div>
</div>
</div><br>
</section>
<section class="color2">
<div class="container">
<div class="row">
<div class="col-xs-6 col-sm-6 col-md-3 col-lg-3">
<h3 class="color3">Servicios</h3>
<a href="#">Servicios 1</a><br>
<a href="#">Servicios 2</a><br>
<a href="#">Servicios 3</a><br>
<a href="#">Servicios 4</a><br>
</div>
<div class="col-xs-6 col-sm-6 col-md-3 col-lg-3">
<h3 class="color3">Servicios</h3>
<a href="#">Servicios 1</a><br>
<a href="#">Servicios 2</a><br>
<a href="#">Servicios 3</a><br>
<a href="#">Servicios 4</a><br>
</div>
<div class="col-xs-6 col-sm-6 col-md-3 col-lg-3">
<h3 class="color3">Servicios</h3>
<a href="#">Servicios 1</a><br>
<a href="#">Servicios 2</a><br>
<a href="#">Servicios 3</a><br>
<a href="#">Servicios 4</a><br>
</div>
<div class="col-xs-6 col-sm-6 col-md-3 col-lg-3">
<h3 class="color3">Servicios</h3>
<a href="#">Servicios 1</a><br>
<a href="#">Servicios 2</a><br>
<a href="#">Servicios 3</a><br>
<a href="#">Servicios 4</a><br>
</div>
</div>
</div><br>
</section>
<footer class="color4">
<div class="container"><br>
<p>Sitio creador por Mauricio Ramos Diseñador Web</p>
<br></div>
</footer>
Regla Adaptar para galería de imágenes (archivo 01.css)
.adaptar
{ width: 100%;
}
No hay comentarios.:
Publicar un comentario