Exécuter
❯
Exécuter le code
Ctrl+Alt+R
Sauvegarder le code
Ctrl+Alt+A
Changer d'orientation
Ctrl+Alt+O
Changer de thème
Ctrl+Alt+D
<!DOCTYPE html> <html> <head> <style> button { taille de police: 15px; padding: 5px 15px; } dialog::backdrop { couleur-de-fond: vert clair; } </style> </head> <body> <h2>Utiliser ::backdrop</h2> <p>Cliquez sur le bouton pour afficher une boîte de dialogue :</p> <button id="dialogBtn">Afficher la boîte de dialogue</button> <dialog id="myDialog"> <form method="dialog"> <p>L'arrière-plan derrière ce dialogue est un décor.</p> <button>Fermer la boîte de dialogue</button> </form> </dialog> <script> const dialogBtn = document.getElementById('dialogBtn'); const myDialog = document.getElementById('myDialog'); dialogBtn.addEventListener('click', () => myDialog.showModal()); </script> </body> </html>