Cafe de Altura HTML

<!
DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Café de altura</title>
<link rel="stylesheet" href="Cafe de altura.css" type="text/css">
</head>
<body>
<nav>
<div class="logo">
<p class="cafedealtura">cafedealtura.com</p>
<img class="tasita" src="images/tasita.png">
</div>
<div class="menu">
<div class="tienda">Tienda</div>
<div class="demas">Subscripción</div>
<div class="demas">Para empresas</div>
<div class="demas">Sobre nosotros</div>
<div class="demas">Contacto</div>
</div>
<div class="telefononav">
<img class="icononav" src="images/icontelefono.png" width="24">
<p class="notelefononav">+34 919 49 05 18</p>
</div>
<div class="sesion">Iniciar sesión</div>
<img class="bolso" src="images/bolso.png">
</nav>
<section id="presentacion">
<div id="texto">
<div id="taza">De la planta a tu taza</div>
<div id="mejorcafe">El mejor café del mundo, ahora en tu casa</div>
<div id="agricultor">Trabajamos con agricultores de todo el mundo para
seleccionar los mejores granos de café y que puedas viajar desde la comodidad de tu
hogar</div>
<div id="boton13">
<div id="origen">Descubrir orígenes</div>
<div id="comprarcafe">Comprar café</div>
</div>
</div>
<img id="manitocafe" src="images/manitocafe.png" alt="Mano cogiendo cafe de
la planta">
</section>
<section id="condiciones">
<div id="principal">Café con las mejores condiciones</div>
<div id="cajas">
<div id="pedido">
<img src="images/check.png">
<h3 id="abc">Recibe tu pedido sin preocuparte</h3>
<p id="abc2">Tienes cosas más importantes en la cabeza, por eso
nuestra suscripción de café, nunca te quedarás sin tu taza de la mañana</p>
</div>
<div id="envio">
<img src="images/car.png">
<h3 id="abc">Envío en 24/48h</h3>
<p id="abc2">Pide tu café antes de las 12h y lo recibirás al día
siguiente</p>
</div>
<div id="descuentos">
<img src="images/persent.png">
<h3 id="abc">Descuentos y beneficios</h3>
<p id="abc2"> Cada dos meses te regalamos una bolsa de un nuevo
origen sorpresa, para que lo descubras junto a nosotros</p>
</div>
</div>
</section>
<section id="novedades">
<div class="novedadestitulo">Novedades</div>
<div class="bolsascafe">
<div class="bolsacafe">
<div class="fotocafe"><img src="images/cafeverde.png"></div>
<p class="nombrecafe">Costa Rica Tarrazú</p>
<p class="precio">9,00 €</p>
<div class="anadir">Añadir</div>
</div>
<div class="fotocafe"><img src="images/caferojo.png"></div>
<p class="nombrecafe">Colombia Los Naranjos</p>
</div>
<div class="fotocafe"><img src="images/cafepistacho.png"></div>
<p class="nombrecafe">Laos Amanecer</p>
</div>
<div class="fotocafe"><img src="images/cafemorado.png"></div>
<p class="nombrecafe">Etiopía Yrgacheff</p>
</div>
<div class="vertodos">
<p class="vertodostexto">Ver todos</p>
<img class="flecha" src="images/flecha.png">
</div>
</div>
</section>
<section id="faq">
Preguntas frecuentes
<div id="preguntas">
<div id="pregunta1">
¿Cómo hago el pedido?
<img src="images/divisor.png" alt="barra divisora">
<div id="respuesta1">Selecciona el café que desees probar y
completa el proceso de compra. Si lo prefieres, te preguntaremos cada cuánto
quieres que te lo mandemos a casa y así nunca te quedarás sin café.</div>
</div>
<div id="pregunta2">
¿Por qué los precios son tan bajos?
<img src="images/divisor.png" alt="barra divisora">
<div id="respuesta2">Viajamos constantemente para encontrar los
mejores granos y a los agricultores más exigentes. Si podemos ofrecerte estos
precios es porque tratamos directamente con los productores de café, sin
intermediarios. Así obtenemos el mejor precio para ti y la persona que está detrás
de los granos de café recibe el mayor beneficio posible. </div>
</div>
<div id="pregunta3">¿Es posible enviar café a mi oficina?</div>
</div>
<div id="dudas">
Resolvemos tus dudas
<div id="flechablanca">
<img src="images/flechablanca.png" height="8" width="18" alt="">
</div>
</div>
</section>
<section id="shop">
<div id="texto2">
<div id="pruebalo">Pruébalo en nuestro coffee shop</div>
<div id="visita">Visita nuestra cafetería en el centro de la ciudad
para probar los granos de café antes de hacer tu pedido y llévate un
descuento</div>
<div id="como">
Como llegar
<div id="flechanegra">
<img src="images/flecha.png" height="8" width="18" alt="">
</div>
</div>
</div>
<img id="cafeteria" src="images/restaurantecafe.jpeg" alt="Una cafeteria">
</section>
<section id="contacto">
<div class="izq">
<p class="entraencontacto">Entra en contacto con nosotros</p>
<p class="parrafo1">Si tienes dudas, ponte en contacto con nosotros a
través del formulario y te
responderemos lo antes posible.</p>
<p class="parrafo2">También puedes ponerte en contacto con nosotros en
nuestra dirección o a través del
teléfono de la tienda</p>
<div class="direccioncontacto">
<p>742 Evergreen Terrace</p>
<p>Springfield, OR 12345</p>
</div>
<div class="tlfcontacto">
<img src="images/icontelefono2.png">
<p class="notlfcontacto">+1 (555) 123-4567</p>
</div><br>
<div class="emailcontacto">
<img src="images/iconcorreo2.png">
<p class="emailcontactotexto">support@example.com</p>
</div>
<div class="trabajocontacto">
<span>¿Buscas un trabajo? </span><span class="ofertascontacto"> Ver
nuestras ofertas</span>
</div>
</div>
<div class="dcha">
<div class="formulariocontacto">
<form method="get" action="#">
<div>
<label for="nombre">Nombre completo</label><br>
<input type="text" id="nombre" name="nombre">
</div>
<div class="formemail">
<label for="email">Email</label><br>
<input type="email" id="email" name="email">
</div>
<div class="formtelef">
<p>Teléfono</p>
<div class="divtelefono">
<select name="prefijo">
<option value="+1">US</option>
<option value="+34">SP</option>
<option value="+39">IT</option>
<option value="+33">FR</option>
</select>
<input class="inputtelefono" type="tel" name="telefono"
placeholder="+1 (555) 987-6543">
</div>
</div>
<div>
<textarea name="dudas" cols="40" rows="8" placeholder="¿En
qué podemos ayudarte?"></textarea>
</div>
<div class="privacidadycondiciones">
<input class="checkbox" type="checkbox" value="aceptado"
name="privacidadycondiciones">
<div class="textocondiciones"><span>Acepto la </span><span
class="ofertascontacto">Política de Privacidad</span><span> y
los</span><span class="ofertascontacto"> Términos y
condiciones.</span></div>
</div><br>
<input class="formaceptar" type="submit" value="Enviar">
</form>
</div>
</div>
</section>
<footer>
<div id="parte1">
<div id="logo2">
<div id="cafedealtura2">cafedealtura.com</div>
<div id="tasita2"><img src="images/tasita.png" width="20.53px"
height="24.93px"></div>
</div><br><br>
<p class="teayudamos">Te ayudamos en</p><br><br>
<div class="footertelef">
<img class="footertelefimg" src="images/icontelefono.png"
width="24">
<p class="footertelefno">+34 919 49 05 18</p>
</div><br><br><br><br>
<div class="footeremail">
<img class="footeremailimg" src="images/iconcorreo.png" width="24">
<p class="footeremailtexto">hola@cafedealtura.com</p>
</div>
<div class="lista1">
<ul>
<li>Tienda</li>
<li>Subscripción</li>
<li>Para empresas</li>
<li>Sobre nosotros</li>
<li>Contacto</li>
</ul>
</div>
<div class="lista2">
<ul>
<li>Política de privacidad</li>
<li>Política de cookies</li>
<li>Términos y condiciones</li>
</ul>
</div>
</div>
</footer>
<div id="parte2">
Todos los derechos reservados - Café de Altura SL - 2022
</div>
</body>
</html>

Cafe de Altura HTML

Cargado por

Información del documento

Título original

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Cafe de Altura HTML

Cargado por

Copyright:

Formatos disponibles

<!

También podría gustarte