/* Botón de Desplegable */ .dropbtn { background-color: #3498DB; color: white; padding: 16px; font-size: 16px; border: none; cursor: pointer; } /* Botón de desplegable al pasar el ratón y al enfocar */ .dropbtn:hover, .dropbtn:focus { background-color: #2980B9; } /* El contenedor
- necesario para posicionar el contenido del desplegable */ .dropdown { position: relative; display: inline-block; } /* Contenido del Desplegable (Oculto por Defecto) */ .dropdown-content { display: none; position: absolute; background-color: #f1f1f1; min-width: 160px; box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2); z-index: 1; } /* Enlaces dentro del desplegable */ .dropdown-content a { color: black; padding: 12px 16px; text-decoration: none; display: block; } /* Cambiar color de los enlaces del desplegable al pasar el ratón */ .dropdown-content a:hover {background-color: #ddd} /* Mostrar el menú desplegable (usar JS para agregar esta clase al contenedor .dropdown-content cuando el usuario haga clic en el botón de desplegable) */ .show {display:block;}