Baixe o app para aproveitar ainda mais
Leia os materiais offline, sem usar a internet. Além de vários outros recursos!
html plantilla
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Faça como milhares de estudantes: teste grátis o Passei Direto
Esse e outros conteúdos desbloqueados
16 milhões de materiais de várias disciplinas
Impressão de materiais
Agora você pode testar o
Passei Direto grátis
Compartilhar
Prévia do material em texto
Videojuegos VENTA plantilla en HTML
html
<!DOCTYPE html>
<html>
<head>
<title>Renta de Videojuegos</title>
<link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
<header>
<nav>
<ul>
<li><a href="#inicio">Inicio</a></li>
<li><a href="#catalogo">Catálogo</a></li>
<li><a href="#servicios">Servicios</a></li>
<li><a href="#contacto">Contacto</a></li>
</ul>
</nav>
</header>
<section id="inicio">
<h1>Renta de Videojuegos</h1>
<h2>Disfruta de los mejores videojuegos en casa</h2>
<a href="#catalogo" class="btn">Ver Catálogo</a>
</section>
<section id="catalogo">
<h2>Catálogo de Videojuegos</h2>
<div class="videojuego">
<img src="videojuego1.jpg" alt="Videojuego 1">
<h3>Nombre del Videojuego</h3>
<p>Consola: Xbox One</p>
<p>Género: Acción</p>
<a href="#" class="btn">Más Información</a>
</div>
<div class="videojuego">
<img src="videojuego2.jpg" alt="Videojuego 2">
<h3>Nombre del Videojuego</h3>
<p>Consola: PlayStation 4</p>
<p>Género: Aventura</p>
<a href="#" class="btn">Más Información</a>
</div>
</section>
<section id="servicios">
<h2>Servicios</h2>
<ul>
<li>Renta de videojuegos para consolas Xbox, PlayStation y Nintendo</li>
<li>Entrega a domicilio y recolección</li>
<li>Amplio catálogo de videojuegos de diferentes géneros</li>
<li>Planes de renta flexibles y precios competitivos</li>
<li>Atención al cliente 24/7</li>
</ul>
</section>
<section id="contacto">
<h2>Contacto</h2>
<form>
<label for="nombre">Nombre:</label>
<input type="text" id="nombre" name="nombre" required>
<label for="email">Email:</label>
<input type="email" id="email" name="email" required>
<label for="mensaje">Mensaje:</label>
<textarea id="mensaje" name="mensaje" required></textarea>
<input type="submit" value="Enviar">
</form>
</section>
<footer>
<p>Todos los derechos reservados © 2023</p>
</footer>
</body>
</html>
```
Y aquí tienes un ejemplo básico de estilos CSS (styles.css) para esta plantilla:
```css
/* Estilos para la página web de renta de videojuegos */
body {
font-family: Arial, sans-serif;
margin: 0;
padding:
0;
}
header {
background-color: #333;
color: #fff;
padding: 20px;
}
nav ul {
list-style: none;
margin: 0;
padding: 0;
}
nav ul li {
display: inline;
margin-right: 10px;
}
nav ul li a {
color: #fff;
text-decoration: none;
}
section {
padding: 20px;
}
section h2 {
margin-bottom: 20px;
}
.videojuego {
display: inline-block;
width: 200px;
text-align: center;
margin: 10px;
}
.videojuego img {
width: 100%;
height: auto;
}
.btn {
display: inline-block;
padding: 10px 20px;
background-color: #333;
color: #fff;
text-decoration: none;
border-radius: 5px;
}
footer {
background-color: #333;
color: #fff;
text-align: center;
padding: 10px;
}
```
Compartilhar