WEBLEB
Inicio
Editora de código
Iniciar sesión
Pro
Español
English
Français
Español
Português
Deutsch
Italiano
हिंदी
cambiar el color
591
mambetov1237.b
Abrir en el editor
Publica tu código
Recomendado
31 January 2025
Películas de tarjetas CSS 3D puras
30 June 2025
Formulario de registro HTML con correo electrónico y contraseña
1 August 2025
Movimiento de la pelota - css
HTML
Copy
<h1>HELLO</h1> <p>Bienvenue sur mon site web!</p> <button onclick="changeColor()"> Changer la couleur, <br /> press twice </button><!-- Replace with your HTML Code (Leave empty if not needed) -->
CSS
Copy
body { font-family: Arial, sans-serif; background-color: #f4f4f4; margin: 0; padding: 0; display: flex; justify-content: center; align-items: center; height: 100vh; flex-direction: column; } h1 { color: white; /* color: #4caf50; */ font-size: 3rem; margin-bottom: 20px; } p { color: white; /* color: #ffd700; */ font-size: 1.5rem; } button { background-color: #4caf50; color: white; border: none; padding: 10px 20px; font-size: 1rem; cursor: pointer; margin-top: 20px; }<!-- Replace with your HTML Code (Leave empty if not needed) -->
JS
Copy
function changeColor() { const body = document.body; const h1 = document.querySelector("h1"); const p = document.querySelector("p"); if (body.style.backgroundColor === "rgb(244, 244, 244)") { body.style.backgroundColor = "#FFD700"; h1.style.color = "#4caf50"; p.style.color = "#4caf50"; } else { body.style.backgroundColor = "#f4f4f4"; h1.style.color = "#white"; p.style.color = "#white"; } }/* Replace with your JS Code (Leave empty if not needed) */
