🌎 Las selecciones con más participaciones en la Copa del Mundo: el top 10 histórico que todo fan debe saber

<div id=»quiz-container»></div> <style> /* — Estilos Base (Modo Claro por defecto) — */ .quiz-container { font-family: Arial, sans-serif !important; max-width: 700px !important; margin: auto !important; background: #fdfdfd !important; padding: 25px !important; border-radius: 12px !important; box-shadow: 0 0 12px rgba(0, 0, 0, 0.08) !important; transition: background-color 0.3s, color 0.3s; /* Transición suave */ } .quiz-header { display: flex !important; justify-content: space-between !important; margin-bottom: 10px !important; font-size: 18px !important; color: #555555; /* Color de texto para cabecera */ } .quiz-timer { color: #e74c3c !important; font-weight: bold !important; } .quiz-progress-bar { height: 10px !important; background: #ddd !important; border-radius: 5px !important; overflow: hidden !important; margin-bottom: 20px !important; } .quiz-progress { height: 100% !important; background: #2ECC71 !important; /* Verde corporativo */ transition: width 0.3s !important; } .quiz-question { font-size: 22px !important; font-weight: 600 !important; margin-bottom: 20px !important; color: #111111; /* Color de pregunta */ } .quiz-options { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 15px !important; } .quiz-option-button { display: flex !important; align-items: center !important; gap: 10px !important; padding: 12px 14px !important; font-size: 16px !important; background: #4161db !important; color: white !important; border: 2px solid transparent !important; border-radius: 8px !important; cursor: pointer !important; transition: all 0.2s ease-in-out !important; text-align: left !important; } .quiz-option-button.correct { background: #c8f7c5 !important; border-color: #27ae60 !important; color: #2d7d33 !important; font-weight: bold !important; } .quiz-option-button.incorrect { background: #f8d7da !important; border-color: #c0392b !important; color: #c0392b !important; font-weight: bold !important; } .quiz-option-label { width: 28px !important; height: 28px !important; border-radius: 50% !important; background: #3498db !important; color: white !important; font-weight: bold !important; display: flex !important; align-items: center !important; justify-content: center !important; flex-shrink: 0 !important; } /* — El resto de los estilos de botones, etc., se mantienen — */ .quiz-controls { margin-top: 20px !important; text-align: center !important; } .quiz-controls button { width: 100% !important; padding: 14px !important; font-size: 16px !important; background: #3498db !important; color: white !important; border: none !important; border-radius: 8px !important; cursor: pointer !important; } .quiz-result-title { font-size: 26px !important; font-weight: bold !important; margin-bottom: 15px !important; text-align: center !important; color: #111111; } .quiz-result-description { font-size: 17px !important; line-height: 1.6 !important; white-space: pre-line !important; text-align: center !important; color: #333333;} .quiz-result-buttons { display: flex !important; flex-direction: column !important; gap: 10px !important; margin-top: 25px !important; text-align: center !important; } .quiz-result-buttons button { padding: 12px !important; font-size: 16px !important; border: none !important; border-radius: 8px !important; cursor: pointer !important; } .quiz-restart-btn { background-color: #2ecc71 !important; color: white !important; } .quiz-share-btn { background-color: #25D366 !important; color: white !important; } /* — Ajustes para MODO OSCURO — */ @media (prefers-color-scheme: dark) { .quiz-container { background: #2d2d2d !important; /* Un fondo gris oscuro */ box-shadow: 0 0 12px rgba(255, 255, 255, 0.05) !important; } .quiz-question, .quiz-header, .quiz-result-title, .quiz-result-description { color: #f1f1f1 !important; /* Un blanco no tan puro, más suave a la vista */ } .quiz-progress-bar { background: #444444 !important; } } @media (max-width: 600px) { .quiz-options { grid-template-columns: 1fr !important; } } </style> <script> (function() { const quizData = [ { question: «🌎 Soy la única selección que ha estado presente en *todas* las ediciones de la Copa del Mundo. Ostento el récord de más títulos, llegando a la gloria en cinco ocasiones, incluyendo la primera fuera de Europa en Suecia 1958. ¿Quién soy?», options: [«Argentina», «Alemania», «Italia», «Brasil»], answer: 3 }, { question: «🏆 He levantado el trofeo mundial en cuatro ocasiones, dos de ellas como una nación dividida. Soy la selección con más partidos disputados en la historia del torneo y la que más veces ha alcanzado la final, aunque no siempre con éxito. ¿Quién soy?», options: [«Italia», «Brasil», «Alemania», «Argentina»], answer: 2 }, { question: «🇮🇹 Soy cuatro veces campeona del mundo, pero he sufrido el amargo trago de quedar eliminada en la fase de clasificación en un par de ocasiones recientes, algo impensable para mi historia. Mi estilo defensivo, el ‘catenaccio’, es legendario. ¿Quién soy?», options: [«España», «Uruguay», «Italia», «Francia»], answer: 2 }, { question: «🇲🇽 A pesar de mis múltiples apariciones en la Copa del Mundo, mi techo histórico han sido los cuartos de final, alcanzados en las dos ocasiones que fui anfitriona. Comparto el segundo puesto en el ranking de participaciones históricas con otras dos grandes potencias. ¿Quién soy?», options: [«Chile», «Estados Unidos», «México», «Portugal»], answer: 2 }, { question: «🇦🇷 He ganado tres Copas del Mundo, la última de ellas con mi capitán finalmente levantando el trofeo. Mis dos primeras victorias tuvieron nombres icónicos que trascendieron el fútbol. Soy una de las selecciones con más subcampeonatos. ¿Quién soy?», options: [«Uruguay», «Brasil», «España», «Argentina»], answer: 3 }, { question: «🇪🇸 Mi único título mundial llegó en suelo africano, en 2010, coronando una generación dorada que dominó el fútbol internacional con un estilo de juego muy particular. Antes de eso, mi mejor resultado había sido un cuarto puesto casi 60 años antes. ¿Quién soy?», options: [«Holanda», «Portugal», «España», «Croacia»], answer: 2 }, { question: «🇫🇷 He sido anfitriona dos veces y en ambas ocasiones logré alcanzar la gran final, ganando una de ellas. Cuento con dos estrellas en mi escudo y he visto a dos de mis jugadores ganar el Balón de Oro del Mundial en diferentes décadas. ¿Quién soy?», options: [«Inglaterra», «Francia», «Bélgica», «Suecia»], answer: 1 }, { question: «🏴󠁧󠁢󠁥󠁮󠁧󠁿 Soy considerada la cuna del fútbol moderno, pero solo he podido ganar la Copa del Mundo una vez, y fue en casa. Mis participaciones han sido constantes, aunque a menudo me he quedado a las puertas del éxito en las fases finales. ¿Quién soy?», options: [«Holanda», «Alemania», «Inglaterra», «Portugal»], answer: 2 }, { question: «🇺🇾 Fui la primera campeona del mundo y la responsable del famoso ‘Maracanazo’. A pesar de ser una nación pequeña en población, mi historia en el Mundial es gigante, con dos títulos y varias semifinales. ¿Quién soy?», options: [«Chile», «Colombia», «Uruguay», «Paraguay»], answer: 2 }, { question: «🇧🇪 Mi ‘generación dorada’ reciente me llevó a mi mejor actuación histórica, un tercer puesto. Soy conocida por mis ‘Diablos Rojos’ y he tenido una presencia continua en los últimos mundiales, consolidando mi lugar entre las selecciones con más participaciones. ¿Quién soy?», options: [«Polonia», «Suiza», «Bélgica», «Dinamarca»], answer: 2 } ]; let current = 0; let score = 0; let timer; let timeLeft = 15; function startTimer() { timeLeft = 15; document.getElementById(«quiz-timer»).innerText = timeLeft; clearInterval(timer); timer = setInterval(() => { timeLeft–; document.getElementById(«quiz-timer»).innerText = timeLeft; if (timeLeft === 0) { clearInterval(timer); disableOptions(); revealCorrect(); } }, 1000); } function renderQuestion() { const q = quizData[current]; const letters = [«A», «B», «C», «D»]; document.getElementById(«quiz-container»).className = «quiz-container»; document.getElementById(«quiz-container»).innerHTML = ` <div class=»quiz-header»> <span>Pregunta ${current + 1} de ${quizData.length}</span> <span class=»quiz-timer»>⏳ Tiempo: <span id=»quiz-timer»>15</span>s</span> </div> <div class=»quiz-progress-bar»><div class=»quiz-progress» style=»width: ${(current / quizData.length) * 100}%»></div></div> <div class=»quiz-question»>${q.question}</div> <div class=»quiz-options»> ${q.options.map((opt, i) => ` <button class=»quiz-option-button» onclick=»selectAnswer(${i})» id=»opt-${i}»> <div class=»quiz-option-label»>${letters[i]}</div> <span>${opt}</span> </button> `).join(«»)} </div> <div class=»quiz-controls»> <button onclick=»nextQuestion()» id=»next-btn» disabled>Siguiente</button> </div> `; startTimer(); } window.selectAnswer = function(index) { clearInterval(timer); const correct = quizData[current].answer; const buttons = document.querySelectorAll(«.quiz-option-button»); buttons.forEach((btn, i) => { btn.disabled = true; if (i === correct) btn.classList.add(«correct»); if (i === index && index !== correct) btn.classList.add(«incorrect»); }); if (index === correct) score++; document.getElementById(«next-btn»).disabled = false; }; function disableOptions() { const buttons = document.querySelectorAll(«.quiz-option-button»); buttons.forEach(btn => btn.disabled = true); document.getElementById(«next-btn»).disabled = false; } function revealCorrect() { const correct = quizData[current].answer; const buttons = document.querySelectorAll(«.quiz-option-button»); buttons[correct].classList.add(«correct»); } window.nextQuestion = function() { current++; if (current < quizData.length) { renderQuestion(); } else { showResults(); } }; function showResults() { let message = «»; if (score === quizData.length) { message = «¡Resultado de Champions! Eres una auténtica enciclopedia del fútbol. 🏆»; } else if (score >= quizData.length * 0.7) { message = «¡Fichaje estrella! Demuestras un conocimiento de Primera División. ⚽️»; } else if (score >= quizData.length * 0.4) { message = «Vas convocado, pero te toca entrenar más. ¡Sigue así! 📘»; } else { message = «Te han pillado en fuera de juego. ¡Una revancha y lo bordas! 🥅»; } const shareText = `¡He acertado ${score} de ${quizData.length} preguntas en el test «${document.title}»! ¿Te atreves a superarme? ${window.location.href}`; document.getElementById(«quiz-container»).innerHTML = ` <div class=»quiz-result-title»>Has acertado ${score} de ${quizData.length} preguntas</div> <div class=»quiz-result-description»>${message}</div> <div class=»quiz-result-buttons»> <button class=»quiz-restart-btn» onclick=»restartQuiz()»>Reiniciar test</button> <button class=»quiz-share-btn» onclick=»shareWhatsApp(‘${encodeURIComponent(shareText)}’)»>Compartir por WhatsApp</button> </div> `; } window.restartQuiz = function() { current = 0; score = 0; renderQuestion(); }; window.shareWhatsApp = function(text) { const url = `https://api.whatsapp.com/send?text=${text}`; window.open(url, ‘_blank’); }; renderQuestion(); })(); </script>