WEBLEB
Accueil
Éditeur
Connexion
Pro
Français
English
Français
Español
Português
Deutsch
Italiano
हिंदी
Un code par agilecloud61
1570
agilecloud61
Ouvrir dans l'éditeur
Video
Publiez votre code
0
Recommandé
26 July 2025
Éditeur HTML en ligne | CodeCanvas - Outil de développement web gratuit
6 April 2025
Un code de Ghost????
14 October 2024
Un modèle de page Web pour « Anes Development » avec un message de bienvenue et une navigation.
HTML
Copy
<html> <head> <title>Image Generator App</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css" rel="stylesheet"> </head> <body> <div class="container text-center"> <h1>Image Generator App</h1> <p>Enter text to generate an image:</p> <input type="text" id="textInput" class="form-control mb-3" placeholder="Enter text"> <button onclick="generateImage()" class="btn btn-primary">Generate Image</button> <div id="imageContainer" class="mt-3"></div> </div> <script> function generateImage() { const text = document.getElementById('textInput').value; const imageContainer = document.getElementById('imageContainer'); // You can make an AJAX call here to fetch image based on text input // For demonstration purposes, let's just display a placeholder image const placeholderImageUrl = 'https://source.unsplash.com/featured/?' + text; const imageElement = document.createElement('img'); imageElement.setAttribute('src', placeholderImageUrl); imageElement.setAttribute('class', 'img-fluid'); imageContainer.innerHTML = ''; imageContainer.appendChild(imageElement); } </script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/js/bootstrap.min.js"></script> </body> </html>
CSS
Copy
/* Replace with your CSS Code (Leave empty if not needed) */
JS
Copy
/* Replace with your JS Code (Leave empty if not needed) */
