Ejemplo E: CSS con Bootstrap
Uso de clases predefinidas de Bootstrap para estilizar botones y contenedores.
<!-- Agregar en el <head> -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<div class="container mt-4">
<h2 class="text-primary text-center">Botón Bootstrap</h2>
<button class="btn btn-success">Aceptar</button>
</div>
Ejemplo F: CSS con Tailwind
Estilizado rápido utilizando clases utilitarias de Tailwind CSS.
<!-- Agregar en el <head> -->
<script src="https://cdn.tailwindcss.com"></script>
<div class="p-6 bg-pink-100 rounded-lg text-center">
<h2 class="text-2xl font-bold text-pink-700">Botón con Tailwind</h2>
<button class="mt-4 px-4 py-2 bg-pink-500 text-white rounded hover:bg-pink-700">Click Aquí</button>
</div>
Ejemplo G: JavaScript Básico
Interacción simple con el DOM mediante JavaScript nativo.
<button onclick="saludar()">Salúdame</button>
<script>
function saludar() {
alert('¡Hola! Bienvenido a la práctica de JavaScript.');
}
</script>