<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>English Word Pronunciations</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      background-color: #f4f4f4;
      padding: 20px;
      max-width: 900px;
      margin: auto;
    }
    .word-container {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
    }
    .word {
      display: flex;
      align-items: center;
      justify-content: space-between;
      background-color: white;
      padding: 10px 15px;
      border-radius: 8px;
      box-shadow: 0 0 5px rgba(0,0,0,0.1);
      width: calc(50% - 10px);
      font-size: 18px;
    }
    button {
      margin-left: 10px;
      padding: 5px 10px;
      font-size: 16px;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <h1>Click to Hear the English Pronunciation</h1>
  <div class="word-container" id="wordList"></div>

  <script>
    const words = [
      "Academy", "address", "adjectives", "afraid", "again", "allegiance", "allow",
      "alphabetically", "although", "amaze", "amazing", "Antarctica", "anthem",
      "anxious", "Arctic Circle", "arrive", "atmosphere", "attached", "attention",
      "autumn", "auxiliary", "avocados", "away", "balance beam", "banking",
      "bathing suit", "beautiful", "blindfolded", "blossom", "bosses", "bracelet",
      "brainy", "built", "bunch", "cafeteria", "camel", "caterpillar", "cheetah",
      "Chinese", "comfortable", "competition", "conducted", "countries",
      "courageous", "crossword puzzle", "crowd", "curiosity", "December",
      "decide", "development", "different", "direction", "dishwasher",
      "distance", "downstairs", "early", "earthquake", "emotions", "equipped",
      "European", "everyone", "everything", "exercising", "expensive", "fable",
      "feast", "festival", "field trip", "finally", "fireworks", "flashcards",
      "float", "freeze", "frequency", "grant", "great", "gymnastics", "hammer",
      "headache", "hear", "heat", "heavy", "hide", "holiday", "hope",
      "horseback", "icebreaker", "identified", "illness", "illustrate",
      "imagination", "immediately", "independence", "ingredients", "interviewed",
      "invitation", "January", "jewelry", "June", "kangaroo", "keyboard", "kicked",
      "kilometers", "kind", "knitting", "lake", "late", "latitude", "leaf",
      "light", "listen", "living", "machine", "magazine", "magnet", "mammals",
      "manager", "manners", "marble", "match", "matter", "mayonnaise", "meeting",
      "message", "middle", "mirror", "modern", "monkey", "months", "moon",
      "morning", "mountain", "movie", "music", "mystery", "narrator",
      "national", "natural", "nature", "naughty", "neighborhood", "nervous",
      "nightmare", "noisy", "November", "nowadays", "numbers", "ocean",
      "October", "officer", "official", "often", "Olympics", "onion", "opinion",
      "opposite", "options", "order", "ordinary", "organization", "original",
      "outside", "overseas", "owner", "package", "painful", "pajamas", "palace",
      "panic", "paragraph", "parents", "park", "party", "passenger", "passport",
      "password", "pattern", "pause", "peanut", "peaceful", "peninsula", "pepper",
      "perfect", "performance", "personality", "photo", "physical", "pianist",
      "picture", "planet", "plastic", "platform", "playground", "plenty",
      "pocket", "poem", "poet", "polar bear", "police", "polite", "popular",
      "population", "position", "possible", "poster", "potato", "practice",
      "predict", "prefer", "prepare", "presentation", "pretty", "principal",
      "private", "problem", "produce", "professional", "program", "protect",
      "provide", "public", "pumpkin", "punish", "puzzle"
    ];

    const wordListDiv = document.getElementById("wordList");

    words.forEach(word => {
      const wordDiv = document.createElement("div");
      wordDiv.className = "word";
      wordDiv.innerHTML = `
        <span>${word}</span>
        <button onclick="speakWord('${word}')">🔊</button>
      `;
      wordListDiv.appendChild(wordDiv);
    });

    function speakWord(word) {
      const utterance = new SpeechSynthesisUtterance(word);
      utterance.lang = 'en-US';
      speechSynthesis.speak(utterance);
    }
  </script>
</body>
</html>


spelling_1

Click to Hear the English Pronunciation

¿PENSANDO COMPRAR O VENDER UNA PROPIEDAD?

Contáctanos

Nuestra Oficina

Llámanos

Correo

Menu