Pestañas de ventanillas de avión
Cada sección es una ventanilla de cabina con la persiana bajada; al elegirla, la persiana sube y deja ver el cielo de esa sección.
Ajustes
Código
<div class="uvq12-cw"><div class="wl" role="tablist" aria-label="Secciones"><button type="button" role="tab" id="uvq12-cw-t0" aria-selected="true" aria-controls="uvq12-cw-p0" tabindex="0"><span class="wn" aria-hidden="true"><span class="vw v0"></span><span class="sh"></span></span><span class="lb">Vuelos</span></button><button type="button" role="tab" id="uvq12-cw-t1" aria-selected="false" aria-controls="uvq12-cw-p1" tabindex="-1"><span class="wn" aria-hidden="true"><span class="vw v1"></span><span class="sh"></span></span><span class="lb">Hoteles</span></button><button type="button" role="tab" id="uvq12-cw-t2" aria-selected="false" aria-controls="uvq12-cw-p2" tabindex="-1"><span class="wn" aria-hidden="true"><span class="vw v2"></span><span class="sh"></span></span><span class="lb">Coches</span></button><button type="button" role="tab" id="uvq12-cw-t3" aria-selected="false" aria-controls="uvq12-cw-p3" tabindex="-1"><span class="wn" aria-hidden="true"><span class="vw v3"></span><span class="sh"></span></span><span class="lb">Ofertas</span></button></div><div class="bd"><span class="lt" aria-hidden="true"></span><div class="pn" role="tabpanel" id="uvq12-cw-p0" aria-labelledby="uvq12-cw-t0">Más de 120 destinos desde Madrid.</div><div class="pn" role="tabpanel" id="uvq12-cw-p1" aria-labelledby="uvq12-cw-t1" hidden>Habitaciones con desayuno incluido.</div><div class="pn" role="tabpanel" id="uvq12-cw-p2" aria-labelledby="uvq12-cw-t2" hidden>Recogida en la misma terminal.</div><div class="pn" role="tabpanel" id="uvq12-cw-p3" aria-labelledby="uvq12-cw-t3" hidden>Hasta un 30 % menos este mes.</div></div></div>Prompt para IA
Pégalo en ChatGPT, Claude o Cursor y adaptará el bloque a tu proyecto con estos ajustes, aunque no uses React.
Más en Navegación
Ver todos: NavegaciónDónde usarlo
Pestañas encajadas en la pared color crema de una cabina de avión: cada sección es una ventanilla ovalada con su persiana de plástico bajada. Al elegir una, la persiana sube con un muelle suave y deja ver un cielo distinto, del azul despejado al atardecer, la noche o el mar, con nubes que pasan. Debajo, una luz de lectura acompaña al texto. Encaja en aerolíneas, agencias de viajes y reservas.
El color principal marca la etiqueta activa y el secundario tiñe la pared de la cabina. Deja entre tres y cinco ventanillas con nombres cortos, y cambia los degradados del CSS para poner tus propias vistas.