PONER ASIENTOS
Publicado por Henry (1 intervención) el 15/06/2023 01:15:49
como le puedo poner asientos para que se seleccionen ya los tengo enumerados solo quiero que aparezcan abajo
[code]<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Datos</title>
<style>
body {
background-color: #f5f5f5;
font-family: Arial, sans-serif;
}
h1, h2 {
text-align: center;
color: #333;
margin: 20px 0;
}
form {
max-width: 500px;
margin: 0 auto;
background-color: #fff;
padding: 20px;
box-shadow: 0 0 10px rgba(0,0,0,0.2);
animation: slideIn 0.5s ease-out;
}
label {
display: block;
margin-bottom: 10px;
color: #666;
font-weight: bold;
}
input[type="text"] {
width: 95%;
padding: 10px;
border: none;
border-bottom: 2px solid #ccc;
transition: border-bottom-color 0.3s;
}
input[type="text"]:focus{
border-bottom-color: #333;
}
input[type="submit"] {
display: block;
margin: 15px auto 0;
background-color: #333;
color: #fff;
border: none;
padding: 10px 20px;
border-radius: 10px;
transition: background-color 0.3s;
}
input[type="submit"]:hover {
background-color: #555;
}
@keyframes slideIn {
from {
transform: translateY(-20%);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
img{
display: block;
margin: auto;
}
select {
font-size: 16px;
padding: 8px;
border: 1px solid #ccc;
border-radius: 10px;
box-shadow: none;
background-color: #f7f7f7;
color: #333;
}
option {
font-size: 16px;
padding: 8px;
background-color: #fff;
color: #333;
}
.boton {
display: inline-block;
margin-top: 20px;
margin-right: 10px;
background-color: #DAC5C0;
color: white;
text-align: center;
padding: 12px;
text-decoration: none;
border-radius: 4px;
transition: background-color 0.3s ease;
}
.boton:hover {
background-color: #DAC5C0;
</style>
</head>
<body>
<h1>DATOS DEL VEHICULO</h1>
<form action="vehiculo.php" method="post">
<h2>DATOS</h2>
<label for="nombre">Boletos:</label>
<input type="text" id="nombre" name="nombrev" required="">
<br>
<br>
<label for="asiento">Asiento:</label>
<select id="asiento" name="asiento" required="">
<option value="">Seleccione un asiento</option>
<option>1A</option>
<option>1B</option>
<option>2A</option>
<option>2B</option>
<option>A3</option>
<option>3B</option>
<option>4A</option>
<option>4B</option>
<option>5A</option>
<option>5B</option>
<option>6A</option>
<option>6B</option>
<option>7A</option>
<option>7B</option>
<option>8A</option>
<option>8B</option>
<option>9A</option>
<option>9B</option>
<option>10A</option>
<option>10B</option>
<!-- Agrega más opciones de asientos aquí -->
</select>
<br>
<br>
<SELECT name="tamano" required="">
<option value="">Tamaño de vehiculo</option>
<option>Grande</option>
<option>Mediano</option>
<option>Pequeño</option>
</select>
<br>
<input type="submit" value="Enviar">
</form>
<a href="registro.php" class="boton">Regresar</a>
<a href="index.php" class="boton" style="float: right;">Siguiente</a>
<img src="logo_registro.png">
</body>
</html>/code]
[code]<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Datos</title>
<style>
body {
background-color: #f5f5f5;
font-family: Arial, sans-serif;
}
h1, h2 {
text-align: center;
color: #333;
margin: 20px 0;
}
form {
max-width: 500px;
margin: 0 auto;
background-color: #fff;
padding: 20px;
box-shadow: 0 0 10px rgba(0,0,0,0.2);
animation: slideIn 0.5s ease-out;
}
label {
display: block;
margin-bottom: 10px;
color: #666;
font-weight: bold;
}
input[type="text"] {
width: 95%;
padding: 10px;
border: none;
border-bottom: 2px solid #ccc;
transition: border-bottom-color 0.3s;
}
input[type="text"]:focus{
border-bottom-color: #333;
}
input[type="submit"] {
display: block;
margin: 15px auto 0;
background-color: #333;
color: #fff;
border: none;
padding: 10px 20px;
border-radius: 10px;
transition: background-color 0.3s;
}
input[type="submit"]:hover {
background-color: #555;
}
@keyframes slideIn {
from {
transform: translateY(-20%);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
img{
display: block;
margin: auto;
}
select {
font-size: 16px;
padding: 8px;
border: 1px solid #ccc;
border-radius: 10px;
box-shadow: none;
background-color: #f7f7f7;
color: #333;
}
option {
font-size: 16px;
padding: 8px;
background-color: #fff;
color: #333;
}
.boton {
display: inline-block;
margin-top: 20px;
margin-right: 10px;
background-color: #DAC5C0;
color: white;
text-align: center;
padding: 12px;
text-decoration: none;
border-radius: 4px;
transition: background-color 0.3s ease;
}
.boton:hover {
background-color: #DAC5C0;
</style>
</head>
<body>
<h1>DATOS DEL VEHICULO</h1>
<form action="vehiculo.php" method="post">
<h2>DATOS</h2>
<label for="nombre">Boletos:</label>
<input type="text" id="nombre" name="nombrev" required="">
<br>
<br>
<label for="asiento">Asiento:</label>
<select id="asiento" name="asiento" required="">
<option value="">Seleccione un asiento</option>
<option>1A</option>
<option>1B</option>
<option>2A</option>
<option>2B</option>
<option>A3</option>
<option>3B</option>
<option>4A</option>
<option>4B</option>
<option>5A</option>
<option>5B</option>
<option>6A</option>
<option>6B</option>
<option>7A</option>
<option>7B</option>
<option>8A</option>
<option>8B</option>
<option>9A</option>
<option>9B</option>
<option>10A</option>
<option>10B</option>
<!-- Agrega más opciones de asientos aquí -->
</select>
<br>
<br>
<SELECT name="tamano" required="">
<option value="">Tamaño de vehiculo</option>
<option>Grande</option>
<option>Mediano</option>
<option>Pequeño</option>
</select>
<br>
<input type="submit" value="Enviar">
</form>
<a href="registro.php" class="boton">Regresar</a>
<a href="index.php" class="boton" style="float: right;">Siguiente</a>
<img src="logo_registro.png">
</body>
</html>/code]
Valora esta pregunta
0
