DPW

<!
doctype html>
<html lang="es">
<head>

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">


<link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
crossorigin="anonymous">
<link rel="stylesheet" href="css/estilos.css">
<title>Hello, world!</title>
</head>
<body>
<header>
<div class="container">
<nav class="navbar navbar-expand-lg navbar-dark">
<div class="container-fluid">
<a class="navbar-brand" href="#">Logo</a>
<button class="navbar-toggler" type="button" data-bs-
toggle="collapse" data-bs-target="#navbarSupportedContent" aria-
controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle
navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse"
id="navbarSupportedContent">
<ul class="navbar-nav ms-auto mb-2 mb-lg-0">
<li class="nav-item">
<a class="nav-link active" aria-current="page"
href="#">inicio</a>
</li>
<a class="nav-link" href="#">nosotros</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#"
id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
servicios
</a>
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">
<li><a class="dropdown-item" href="#">servicio 1</a></li>
<li><hr class="dropdown-divider"></li>
<li><hr class="dropdown-divider"></li>
</ul>
</li>
<a class="nav-link disabled" href="#" tabindex="-1" aria-
disabled="true">contactos</a>
</li>
</ul>
</div>
</div>
</nav>
</div>
</header>
<section class="carrusel">
<div id="carouselExampleCaptions" class="carousel slide" data-bs-
ride="carousel">
<div class="carousel-indicators">
<button type="button" data-bs-target="#carouselExampleCaptions" data-
bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
bs-slide-to="1" aria-label="Slide 2"></button>
bs-slide-to="2" aria-label="Slide 3"></button>
</div>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="https://picsum.photos/1920/500" class="d-block w-100"
alt="...">
<div class="carousel-caption d-none d-md-block">
<h2>El titulo de la primera imagen</h2>
<p>la primera descripcion del titulo de la imagen 1.</p>
</div>
</div>
<div class="carousel-item">
alt="...">
<p>la segunda descripcion del titulo de la imagen 2.</p>
</div>
</div>
<div class="carousel-item">
alt="...">
<p>la tercera descripcion del titulo de la imagen 3.</p>
</div>
</div>
</div>
<button class="carousel-control-prev" type="button" data-bs-
target="#carouselExampleCaptions" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-
target="#carouselExampleCaptions" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
</section>
<section class="nosotros my-5">
<h2 class="text-center my-5">Quienes Somos</h2>
<div class="row">
<div class="col-6 text-justify">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Rerum
praesentium, voluptates provident distinctio dolor nostrum dignissimos minus illum
neque saepe libero ea veritatis numquam perspiciatis vero, voluptatem nam iste
quos?</p>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit.
Quibusdam dolore sed iure ea. Blanditiis sit labore rem nostrum aliquid hic
recusandae eos illo debitis saepe, excepturi veritatis impedit minus nesciunt!</p>
</div>
<div class="col-6">
<img class="img-fluid" src="https://picsum.photos/800/300" alt="">
</div>
</div>
</div>
</section>
<section class="nosotros my-5">
<h2 class="text-center my-5">Nuestros servicios</h2>
<div class="row">
<div class="col-4">
<div class="card text-center">
<img src="https://picsum.photos/500/300" class="card-img-top"
alt="...">
<div class="card-body">
<h5 class="card-title">Servicio 1</h5>
<p class="card-text">Some quick example text to build on the card
title and make up the bulk of the card's content.</p>
<a href="#" class="btn btn-primary">Ver Mas</a>
</div>
</div>
</div>
<div class="col-4">
alt="...">
</div>
</div>
</div>
<div class="col-4">
alt="...">
</div>
</div>
</div>
</div>
</div>
</section>
<section class="contactenos bg-info py-5">
<h2 class="text-center">Contactanos</h2>
<div class="row">
<div class="mb-3 col-4">
<label for="exampleInputEmail1" class="form-label">Nombres</label>
<input type="text" class="form-control" id="Nombre" aria-
describedby="Nombre">
<div id="Nombre" class="form-text">Mensaje a mostrar para Nombre.</div>
</div>
<label for="exampleInputPassword1" class="form-label">Password</label>
<input type="password" class="form-control" id="exampleInputPassword1">
</div>
<label for="asunto" class="form-label">Asuntos</label>
<input type="text" class="form-control" id="Nombre" aria-
describedby="Nombre">
<div id="asunto" class="form-text">Mensaje a mostrar para Nombre.</div>
</div>
<label for="Mensaje">Mensaje</label>
<textarea class="form-control" name="Mensaje" id="col-30"
rows="5"></textarea>
</div>
<div class="text-center"><button type="submit" class="btn btn-

primary">Enviar</button></div>
</form>
</div>
</section>
<section>
<iframe width="1303" height="400" frameborder="0" scrolling="no"
marginheight="0" marginwidth="0" id="gmap_canvas"
src="https://maps.google.com/maps?width=520&height=400&hl=en&q=av.Beni
%20Mamore/B/Taruma/diagonal%20posta%20taruma%20riberlta%20+
(BOLIVIA)&t=&z=12&ie=UTF8&iwloc=B&output=embed"></iframe>
</section>
<footer>
<div class="row">
<div class="columna columna-25">
<img src="img/logo-blanco.png" class="logo-footer">
<p></p>
</div>

<h3>
TEMAS RELACIONADOS
</h3>
<ul>
<li><a href="#"> Tema 1</a></li>
</ul>
</div>

<h3>
DATOS DE CONTACTOS
</h3>
<ul>
<li>reysonfernandobattechuqui@gmai.com</li>
<li>+59169368676</li>
<li>Av.palma real 331-posta taruma<br> Riberalta-Beni-Bolivia
</li>
</ul>
</div>
<h3>
REDES SOCIALES
</h3>
<ul>
<li><a href="#"><i></i></a></li>
<li><a href="#"><i></i></a></li>
<li><a href="#"><i></i></a></li>
</ul>
</div>
</div>
</di>
<div class="barra-footer">
© DERECHOS RESERVADOS - 2024
</div>
</footer>



<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
crossorigin="anonymous"></script>



</body>
</html>
header{
background-color: blueviolet;
}
.nosotros{
text-align: justify;
line-height: 1cm;

DPW

Uploaded by

Copyright:

Available Formats

DPW

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

DPW

Uploaded by

Copyright:

Available Formats

<!

<div class="text-center"><button type="submit" class="btn btn-

<div class="columna columna-25">

<div class="columna columna-25">

<div class="columna columna-25">

You might also like